JSFiddle - React, Tailwind, and code Playground
by serio
HTML
<script src="http://harvesthq.github.com/chosen/chosen/chosen.jquery.js"></script>
<link rel=stylesheet href=http://harvesthq.github.com/chosen/chosen/chosen.css
/>
<select id=wee data-placeholder="Choose a Country" style="width:350px;"
multiple="" tabindex="3">
<option value="United States">United States</option>
<option value="United Kingdom">United Kingdom</option>
<option value="Afghanistan">Afghanistan</option>
<option value="Aland Islands">Aland Islands</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="American Samoa">American Samoa</option>
<option value="Andorra">Andorra</option>
<option value="Angola">Angola</option>
<option value="Anguilla">Anguilla</option>
<option value="Antarctica">Antarctica</option>
<option value="Antigua and Barbuda">Antigua and Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Aruba">Aruba</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>
<option value="Belize">Belize</option>
<option value="Benin">Benin</option>
<option value="Bermuda">Bermuda</option>
<option value="Bhutan">Bhutan</option>
<option value="Bolivia, Plurinational State of">Bolivia, Plurinational State of</option>
<option value="Bonaire, Sint Eustatius and Saba">Bonaire, Sint Eustatius and Saba</option>
<option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>
<option value="Botswana">Botswana</option>
<option value="Bouvet Island">Bouvet Island</option>
...
JavaScript
$(".chzn-select").chosen({
no_results_text: "No results matched"
});
$(function () {
$('.add').click(function (e) {
// constructing a ghetto li
var text = $('select option:selected').text();
var toAdd = $('<li class=search-choice><span>' + text + '</span><a href="javascript:void(0)" class="search-choice-close"></a></li>');
toAdd.appendTo('.chzn-container ul');
});
$('.chzn-choices').on('click', '.search-choice-close', function(e) {
$( this ).parent().remove();
});
});