<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <select> <option value="0" class="optionGroup"><b>Hello Parent Tag</b></option> <option value="1" class="optionChild">Child Tag</option> <option value="2" class="optionChild">Child Tag</option> </select>

<link rel="stylesheet" type="text/css" href="http://morganthall.com/ujo/chosen-koenpunt/chosen.css"> <style type='text/css'> .optionGroup { font-weight:bold; font-style:italic; text-indent:2px; } .optionChild { padding-left:15px; } </style>

<script type='text/javascript' src="http://morganthall.com/ujo/chosen-koenpunt/chosen.jquery.min.js"></script> <script type='text/javascript'> $(window).load(function(){ $(".chzn-select").chosen({ create_option: true, persistent_create_option: true, create_option_text: 'add', }); }); </script>