Select Lists with Option Groups

by raad

HTML

<form>Select an entry:
    <br/><br/>
    <select id="theSelect" multiple="multiple" size="10">
        <optgroup label="Search result (4 entries)">
            <option value="1">Entry 1</option>
            <option value="2">Entry 2</option>
            <option value="3">Entry 3</option>
            <option value="4">Entry 4</option>
        </optgroup>
    </select>
</form>
<br>
<input type="button" value="◄ Remove" onclick="removeOpt()" />

JavaScript

function removeOpt() {
    var selFrom = document.getElementById('theSelect');

    for (var i = selFrom.options.length - 1; i >= 0; i--) {
        var theOpt = selFrom.options[i];
        
        if (theOpt.selected) {
            text = theOpt.text;
            optParent = theOpt.parentNode;
            optParent.removeChild(theOpt);
        }
    }
}