title: Non selectable option value
body: <p>What is the best way to add a new option to a dropdown menu, and make it so that it is non selectable and the first in the list?</p>
  <p>So the list should look like this:</p>
  <pre><code>&lt;select onchange=&quot;document.getElementById('product_configure_form').action = 'http://webshop.com/product/options/3603848/'; document.getElementById('product_configure_form').submit();&quot; id=&quot;product_configure_option_22853&quot; name=&quot;option[22853]&quot;&gt;
  
    &lt;option selected=&quot;selected&quot; value=&quot;78619&quot;&gt;Choose a size&lt;/option&gt; // this is the new not selectable option
    &lt;option selected=&quot;selected&quot; value=&quot;78619&quot;&gt;S&lt;/option&gt;
    &lt;option value=&quot;78620&quot;&gt;M&lt;/option&gt;
    &lt;option value=&quot;78621&quot;&gt;L&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  <p>I know how to add an option with:</p>
  <pre><code>$('#product_configure_option_22853').append('&lt;option value=&quot;Choose&quot; selected=&quot;selected&quot;&gt;{{ 'select your size' | t }}&lt;/option&gt;');
  </code></pre>
  <p>But how do I make it non selectable and the first on the list?</p>