<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<h3>Where is your property located? </h3>
<p>This will determine which State specific listing agreement is created.</p>
<div class="btn-group">
<i class="dropdown-arrow dropdown-arrow-inverse"></i>
<button class="btn btn-primary status">Select State</button>
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> <span class="caret"></span>
</button>
<ul class="dropdown-menu dropdown-inverse">
<li><a href="#link">Massachusetts</a>
</li>
<li><a href="#link">New Hampshire</a>
</li>
</ul>
</div>
$('.dropdown-inverse li > a').click(function(e) {
$('.status').text(this.innerHTML);
});