title: How do I temporarily remove an option in a select statement in Microsoft Edge?
body: <p>In my code I take advantage of the ability to disable and enable style tags to hide/show optgroup tags and their option tags. However when hiding optgroups this way in Microsoft Edge, it places a blank line instead of no line at all.</p>
  
  <p>An example:</p>
  
  <pre><code>&lt;optgroup class="my-option" label="truck"&gt;
    &lt;option class="business"&gt;Business truck&lt;/option&gt;
  &lt;/optgroup&gt;
  
  
  
  &lt;style id="enable_disable"&gt;
    .my-option {display: none; visibility:hidden;}
  &lt;/style&gt;
  </code></pre>
  
  <p>Then, in my javascript code I hide the optgroup this way:</p>
  
  <pre><code>document.getElementById('enable_disable').media = 'all';
  </code></pre>
  
  <p>To show the optgroup I do this:</p>
  
  <pre><code>document.getElementById('enable_disable').media = 'disable';
  </code></pre>
  
  <p>The same thing occurs if I do this just for the "business" class, except the user can select the option, he or she just can't see text, just a blank line.</p>
  
  <p>Edit:
  <a href="http://jsfiddle.net/rans8pew/2/" rel="nofollow">Here</a> is a working example of what I am doing. You can see that it behaves the same in all browsers except for edge.</p>