Bootstrap Multiselect Skeleton
HTML
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css">
<link rel="stylesheet" href="http://davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script>
<script src="http://davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<p>
<select name="property_city" id="p-city">
<option class="button" value="new-york-city" selected>New York City</option>
<option class="button" value="">All</option>
<option class="button" value="dallas-tx">Dallas, TX</option>
<option class="button" value="las-vegas">Las Vegas, NV</option>
<option class="button" value="los-angeles">Los Angeles, CA</option>
<option class="button" value="miami">Miami, FL</option>
<option class="button" value="new-york-city">New York City, NY</option>
<option class="button" value="san-francisco">San Francisco, CA</option>
<option class="button" value="seattle-wa">Seattle, WA</option>
</select>
</p>
<p>
<select name="property_nhb[]" id="p-nhb" multiple>
<option class="button">All</option>
<option data-val="los-angeles" value="beverly-hills" >Beverly Hills</option>
<option data-val="los-angeles" value="santa-monica" >Santa Monica</option>
<option data-val="miami" value="hialea" >Hialea</option>
<option data-val="miami" value="little-havana">Little Havana</option>
<option data-val="miami" value="north-miami">North Miami</option>
<option data-val="miami" value="south-beach">South Beach</option>
<option data-val="new-york-city" value="chelsea">Chelsea</option>
<option data-val="new-york-city" value="harlem">Harlem</option>
<option data-val="new-york-city" value="noho">NoHo</option>
<option data-val="new-york-city" value="soho">SoHo</option>
</select>
</p>
JavaScript
var select_clone = $('<select>')
.html($('#p-nhb option'))
.hide()
.insertAfter('#p-nhb');
$('#p-city')
.change(function() {
$('#p-nhb').html(select_clone.find('[data-val="' + this.value + '"]').clone());
$('#p-nhb').multiselect('refresh');
})
.change();