SO - 16458570

by Arun P Johny

HTML

<select id="MainContent_DropDownList1">
    <option value="e1" class="Employees">E1</option>
    <option value="g1">G1</option>
    <option value="e2" class="Employees">E2</option>
    <option value="g2">G2</option>
    <option value="e3" class="Employees">E3</option>
    <option value="g3">G4</option>
</select>

JavaScript

var selectControl = $('#MainContent_DropDownList1')

var EmployeesGRP = jQuery('<optgroup/>', {
    label:'Employees'
}).appendTo(selectControl);
var GroupsGRP = jQuery('<optgroup/>', {
    label:'Groups'
}).appendTo(selectControl);

jQuery('option', selectControl).each(function (i) {
    var item = jQuery(this);
    
    if (item.hasClass("Employees")) {
        item.appendTo(EmployeesGRP );
    } else {
        item.appendTo(GroupsGRP);
    }
});