JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ivaynberg.github.io/select2/bootstrap/css/bootstrap.css">
<script src="http://ivaynberg.github.io/select2/bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://ivaynberg.github.io/select2/select2-3.4.5/select2.css?ts=2014-02-03T15%3A41%3A41-08%3A00">
<script src="http://ivaynberg.github.io/select2/select2-3.4.5/select2.js?ts=2014-02-03T15%3A41%3A41-08%3A00"></script>
<select style="width:300px" id="source" placeholder="testt test">
    <option></option>
    <optgroup label="Alaskan/Hawaiian Time Zone">
        <option value="AK">Alaska</option>
        <option value="HI">Hawaii</option>
    </optgroup>
    <optgroup label="Pacific Time Zone">
        <option value="CA">California</option>
        <option value="NV">Nevada</option>
        <option value="OR">Oregon</option>
        <option value="WA">Washington</option>
    </optgroup>
</select>

JavaScript

$(document).ready(function () {
    $("#source").select2({
        placeholder: "Select a State",
        allowClear: true
    });
});