title: Why is my HTML Select box in Opera Browser not behaving?
body: <p>I have a simple select element on my page:</p>
  
  <pre><code>&lt;select id="info_routes" size="10"&gt;&lt;/select&gt;
  </code></pre>
  
  <p>This select box gets populated at page load via jquery at document ready:</p>
  
  <pre><code>for (var route in _routes) {
    var val   = _routes[route].id;
    var key   = 'route_'+val;
    $("&lt;option /&gt;").attr({id: key, value: val}).appendTo('#info_routes');
    $('#info_routes &gt; #'+key).text(_routes_text(_routes[route]));
  }
  </code></pre>
  
  <p>The result is:</p>
  
  <pre><code>&lt;select id="info_routes" size="10"&gt;
    &lt;option id="route_1" value="1"&gt;9 - Two Nations Crossing&lt;/option&gt;
    &lt;option id="route_2" value="2"&gt;13S - Prospect&lt;/option&gt;
    &lt;option id="route_3" value="3"&gt;13N - Brookside Mall&lt;/option&gt;
    ...
  &lt;/select&gt;
  </code></pre>
  
  <p>The problem is when this element is rendered in Opera 10 this happens:</p>
  
  <p>See attached photo here <a href="http://tinypic.com/r/n4yrk9/4" rel="nofollow noreferrer">http://tinypic.com/r/n4yrk9/4</a>
  (Note, I used tinypic.com, please excuse the abundance of ads I picked the first free image hosting site I found on google) </p>
  
  <p>It behaves as if the apple-command/pc-ctrl button is being held :( </p>
  
  <p>This is not supposed to be a multi-select element, yet the items remain selected after another item is selected.  Also the first item when selected doesn't highlight at all.</p>
  
  <p>Any ideas as to why this is happening and how to remedy it would be much appreciated!</p>