JSFiddle - React, Tailwind, and code Playground

by yoowordpress

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
<select id="multiple-select-box" class="js-example-basic-multiple" data-placeholder="Type to search cities" name="traditional" multiple="multiple">
    <optgroup label="Austria">
        <option value="54">Vienna</option>
    </optgroup>
    <optgroup label="Belgium">
        <option value="2">Antwerp</option>
        <option value="9">Brussels</option>
    </optgroup>
    <optgroup label="Bulgaria">
        <option value="48">Sofia</option>
    </optgroup>
    <optgroup label="Croatia">
        <option value="58">Zagreb</option>
    </optgroup>
    <optgroup label="Czech Republic">
        <option value="42">Prague</option>
    </optgroup>
    <optgroup label="Denmark">
        <option value="13">Copenhagen</option>
    </optgroup>
    <optgroup label="Engl" style="color:red;">
        <optgroup label="England">
            <option value="6" data-timezone="+00:00">Birmingham</option>
            <option value="7" data-timezone="+00:00">Bradford</option>
            <option value="26" data-timezone="+00:00">Leeds</option>
            <option value="30" data-timezone="+00:00">London</option>
            <option value="34" data-timezone="+00:00">Manchester</option>
            <option value="47" data-timezone="+00:00">Sheffield</option>
        </optgroup>
        <optgroup label="Finland">
            <option value="25" data-timezone="+02:00">Helsinki</option>
        </optgroup>
    </optgroup>
    <optgroup label="France">
        <option value="35" data-timezone="+01:00">Marseille</option>
        <option value="40" data-timezone="+01:00">Paris</option>
    </optgroup>
    <optgroup label="Germany">
        <option value="5" data-timezone="+01:00">Berlin</option>
        <option value="8" data-timezone="+01:00">Bremen</option>
        <option value="12"...

JavaScript

$('select').select2();
$('a').click(function (e) {
    alert($('select').val());
});