title: jQuery: find the <optgroup> for a selected value in a <select> element
body: <p>I have a dropdown menu with different option groups. If someone selects an option, how can I check which optgroup it belongs to? For example if 'ferrari' were selected, how would you determine which optgroup it belongs to? </p>
  
  <p>Feel free to use jQuery or raw javascript.</p>
  
  <pre><code>&lt;select name="testSelect"&gt;
     &lt;optgroup label="fruits"&gt;
        &lt;option value="apples"&gt;Apples&lt;/option&gt;
        &lt;option value="oranges"&gt;Oranges&lt;/option&gt;
        &lt;option value="pears"&gt;Pears&lt;/option&gt;
     &lt;/optgroup&gt;
     &lt;optgroup label="cars"&gt;
        &lt;option value="ford"&gt;ford&lt;/option&gt;
        &lt;option value="toyota"&gt;toyota&lt;/option&gt;
        &lt;option value="ferrari"&gt;ferrari&lt;/option&gt;
     &lt;/optgroup&gt;
  &lt;/select&gt;
  </code></pre>