"Goto" optgroup based on selection

http://stackoverflow.com/questions/10930606/jquery-to-go-to-an-optgroup-label

HTML

<select id="category" name="category">
<option selected="selected" value="0">Choose a category...</option>
<option value="1">Art Styles</option>
<option value="2">Art Subjects</option>
<option value="3">Media</option>
<option value="4">Photography</option>
</select>
<select multiple="multiple" id="subcategory" size="10" name="category_ids[]">
<optgroup label="Art Styles">
<option value="5">Abstract</option>
<option value="6">Animation</option>
<option value="7">Architecture</option>
<option value="8">Art Deco</option>
<option value="9">Cubist</option>
<option value="10">Fashion</option>
<option value="11">Fine Art</option>
<option value="12">Impressionist</option>
<option value="13">Pop Art</option>
<option value="14">Surrealists</option>
<option value="15">Tribal Art</option>
<option value="16">Vintage</option>
<option value="17">World Cultures</option>
<option value="18">Graphics</option>
</optgroup>
<optgroup label="Art Subjects">
<option value="19">Animals</option>
<option value="20">Buildings</option>
<option value="21">Countryside</option>
<option value="22">Cityscapes</option>
<option value="23">Food &amp; Drink</option>
<option value="24">Floral/ Botanical</option>
<option value="25">Futuristic</option>
<option value="26">Gothic &amp; Fantisy</option>
<option value="27">Graffiti</option>
<option value="28">Landscapes</option>
<option value="29">Movement Style</option>
<option value="30">Musical</option>
<option value="31">Night Time</option>
<option value="32">Performing Arts</option>
<option value="33">Religious &amp; Spiritual</option>
<option value="34">Photography</option>
<option value="35">Portrait &amp; Figurative</option>
<option value="36">Product Design</option>
<option value="37">Seascape &amp; Seashore</option>
<option value="38">Signs &amp; Symbols</option>
<option value="39">Silhouettes</option>
<option value="40">Sketches &amp; Line</option>
<option value="41">Sports</option>
<option value="42">Still lIfe</option>
<option...

JavaScript

$('#category').change(function() {
    var cat = $("#category :selected").text();
    var $subcat = $('#subcategory');
    var optheight = $subcat.height() / $subcat.attr('size');
    $subcat.find('optgroup').each(function(index) {
        $optgroupFirstChild = $('#subcategory optgroup[label="' + $(this).attr('label') + '"]').children('option:first');
        if ($(this).attr('label') == cat) {
          $subcat.scrollTop($optgroupFirstChild[0].index * optheight + (index * optheight));
        }
    });
});