title: moving select options up and down via jquery
body: <p>so I got this code working for Firefox and Chrome...what it does is it allows you to reorder the options within an HTML select form...but then when I tested the code via IE8, it's kind of patchy...it only works for the first few clicks and after that you have to click many times on the button for it to work..</p>
  
  <p>Does anybody know any other code that allows you to reorder select field items that works perfectly in IE8?</p>
  
  <pre><code>&lt;select id="list" multiple="multiple"&gt;
       &lt;option value="wtf"&gt;bahaha&lt;/option&gt;
          &lt;option value="meh"&gt;mwaahaha&lt;/option&gt;
  
  &lt;/select&gt;
  &lt;button id="mup"&gt;Move Up&lt;/button&gt;
  &lt;button id="mdown"&gt;Move Down&lt;/button&gt;
  &lt;a href="#"&gt;Add Item&lt;/a&gt;
  &lt;a href="#"&gt;Remove item&lt;/a&gt;
  
  &lt;script&gt;
  
  $(document).ready(function(){
  
   $('#mup').click(function(){
  
    moveUpItem();
  
   });
  
   $('#mdown').click(function(){
  
    moveDownItem();
  
   });
  
  
  });
  
   function moveUpItem(){
    $('#list option:selected').each(function(){
     $(this).insertBefore($(this).prev());
    });
   }
  
   function moveDownItem(){
  
    $('#list option:selected').each(function(){
     $(this).insertAfter($(this).next());
    });
  
   } 
  </code></pre>