 <p>first, you have to give a class or id to your select HTML element.</p> <p><div class="snippet" data-lang="js" data-hide="false"> <div class="snippet-code"> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;select class="chosen" .... //same html/php code</code></pre> </div> </div> </p> <p>Then in your javascript code, you call the jQuery chosen plugin to change this select to a chosen element like this:</p> <p><div class="snippet" data-lang="js" data-hide="false"> <div class="snippet-code"> <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function(){ $('.chosen').chosen(); })</code></pre> </div> </div> </p> <p>and it should work, you don't have to change anything in you php code, just give a class or id to you your select element so you can get if with jQuery selector. I advice you to read the chosen documentation</p>