<link href="//cdn.bootcss.com/select2/3.5.4/select2.min.css" rel="stylesheet"/>

<script src="//cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>

<script src="//cdn.bootcss.com/select2/3.5.4/select2.min.js"></script>

<script>

$(document).ready(function() {

    $("#e19").select2({ maximumSelectionSize: 3 });

});

</script>

<select multiple id="e19" style="width:300px">

    <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>