title: Scrolling select element jumps to top when removing options from DOM in IE
body: <p>This issue appears to be isolated to Internet Explorer:</p>
  
  <p>I'm moving <code>option</code> tags from one <code>select</code> to another when they're double clicked using Javascript. The <code>select</code> elements can have many items, so I've set the height with <code>overflow: auto;</code> so that they scroll. If you scroll down the list and double click an item to move, the <code>select</code> list will scroll up to the top when the <code>option</code> is removed, instead of staying at the current scrolled-to position as it does in Chrome or Firefox.</p>
  
  <p>I made a basic example to demonstrate this here: <a href="https://jsfiddle.net/yk8LeLbw/1/" rel="nofollow">https://jsfiddle.net/yk8LeLbw/1/</a></p>
  
  <p>The Javascript is pretty simple:</p>
  
  <pre><code> $(".listBoxSelectorAvail").dblclick(function() {
       $(this).find("option:selected").remove().appendTo(".listBoxSelectorAssigned");
   });
   $(".listBoxSelectorAssigned").dblclick(function() {
     $(this).find("option:selected").remove().appendTo(".listBoxSelectorAvail");
   });
  </code></pre>
  
  <p>I haven't been able to find any specific reason why this happens - I'm not sure if it's a bug or if this is expected behavior, but is there anything that can be done?</p>
  
  <p>EDIT: made the title more clear</p>
  
  <p>EDIT 2: I was hoping to <em>stop</em> the scrolling, but the best solution I've come up so far is to rescroll once the item has been moved, as seen here:
  <a href="https://jsfiddle.net/yk8LeLbw/2/" rel="nofollow">https://jsfiddle.net/yk8LeLbw/2/</a></p>