帮忙解决一个2级联动的问题，下来框怎么清空！！！

[老鼠找猫]

页面：
国家:<select style="width:100px;" id="drop_guojia" name="guojia" onchange="select1_onchange()"></select>
地区：<select id="drop_diqu" name="diqu" style="width:100px;"></select>
js：
function select1_onchange()
{
debugger;
createXmlHttpRequest();
var name = document.getElementById("drop_guojia").value;
var url = "WebService.asmx/GetData2?cityID="+escape(name);
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange = requestXMLHttp1;
xmlHttp.send(null);
}

function requestXMLHttp1()
{
if(xmlHttp.readyState == 4)
{
if(xmlHttp.status == 200)
{
var rootNode = xmlHttp.responseXML.documentElement;
for(var i = 0;i<rootNode.childNodes.length;i++)
{
document.getElementById("drop_diqu").length = 1;
document.getElementById("drop_diqu").options[0].selected = true;
var value = rootNode.childNodes[i].childNodes[0].firstChild.nodeValue;
var text = rootNode.childNodes[i].childNodes[1].firstChild.nodeValue;

var opt = new Option();
opt.value = value;
opt.text = text;
document.getElementById("drop_diqu").options.add(opt);
}
}
}
}

当我第一个下拉框触发select1_onchange()事件的时候，第二个下拉框的值怎么清空，要不然，它会把原来的跟现在选择的累加起来，
我在循环里面加了一句document.getElementById("drop_diqu").length = 1;但只有一条记录了，要怎么解决，怎么清空他。
只显示属于我选择第一个下拉框下面的值。

谢谢，各位帮忙解决下

[yuxh81]

jquery语法：obj.children().remove();

js的不知道，等楼下高手。。。

[hoojo]

document.getElementById( "drop_diqu ").options.length   =   0;