JavaScript 如何同时清空下拉框中的optgroup和options

下拉框中同时存在optgroup和options,如何清空它们,然后重新创建新的下拉框?

http://www.poluoluo.com/jzxy/201107/138067.html


<select id="sel">
    <optgroup label="number">
        <option>1</option>
        <option>2</option>
    </optgroup>
    <optgroup label="alpha">
        <option>a</option>
        <option>b</option>
    </optgroup>
</select>
<script>
    var sel = document.getElementById('sel');
    setTimeout(function () {
        sel.innerHTML = ''//清空所有内容,包括分组

        var optg = document.createElement('optgroup'); optg.label = 'number'; sel.appendChild(optg); //添加分组
        var opt = document.createElement('option'); opt.text = opt.innerText = 1; optg.appendChild(opt);
        //....继续创建option添加到分组中


        //...同理添加其他组
    }, 2000);//2s后重建number组
</script>