title: jQuery multiselect drop down menu
body: <p>I have a simple html multi select drop down list:</p>
  
  <pre><code>&lt;select id="transactionType" multiple="multiple" size="10"&gt;
    &lt;option value="ALLOC"&gt;ALLOC&lt;/option&gt;
    &lt;option value="LOAD1"&gt;LOAD1&lt;/option&gt;
    &lt;option value="LOAD2"&gt;LOAD2&lt;/option&gt;
    &lt;!-- etcetera... --&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>I want to continue to use this list in the event javascript is disabled however with javaScript I would like to render the list as a multi-select drop down list. That is it only shows one item in the list until clicked and then will expand to show x items and provide scrolling, where I can select multiple elements as you would expect while holding shift or ctrl.</p>
  
  <p>New to jQuery was searching the <a href="http://jquery.com/" rel="noreferrer">http://jquery.com/</a> but haven't yet found what I need.</p>
  
  <p><strong>Edit</strong> Struts2 users, the selected answer will url encode with [] this causes issues in struts2 the fix however is very easy. Simply open jquery.multiSelect.js and search for "[]" and delete the one instance this is used in a string concatenation. I also am using jQuery 1.4.4 as opposed to the 1.3.2 which came bundled with it and everything works just fine. </p>