为＜select＞集合添加选项只有最后一个select添加成功的原因

问题：

我有一个页面上装载了四个动态表格，table的name都是example，每个table的每一行里面都有一个叫field4的<select>，现在我要根据表单上的一些域值生成选项添加进这些<select>中。

处理过程：

function createSelectOptios() {
    ……
    var optionList = new Array();
    var option = document.createElement("option");
    option.value ="";
    option.innerText = "";
    optionList.push(option);
    for (var index = 0; index < gdmcElemlist.length; index++) {
        var element = gdmcElemlist[index];
        var option = document.createElement("option");
        option.value =element.value;
        option.innerText = element.value;
        optionList.push(option);
    }    
 var targetElementSet = dojo.query("select[ name = field4]"); 
 //获取所有的name=field4的select 
 for(var i=0;i<targetElementSet.length;i++){
  addOptions(targetElementSet[i], optionList);
 }
 dojo.empty(optionList);
}
function addOptions(tmptargetElement, optionElementList) {
    if(!tmptargetElement) return;
    var element = tmptargetElement;
    removeAllChildren(element);
    for (var i = 0; i < optionElementList.length; i++) {
        element.appendChild(dojo.clone(optionElementList[i]));
    }
}
function removeAllChildren(element){
    for(var i=element.childNodes.length;i>=0;i--){
    element.remove(i);
    }
}

整个的处理过程就如贴出的代码段一样，一直添加只有最后一个成功原因是：

没有添加   element.appendChild(dojo.clone(optionElementList[i]));中的dojo.clone(optionElementList[i])。

没有添加之前一直都是最后一个select元素添加成功，是因为，每次循环我为每个select对象添加的都是同一个option对象，整个页面上就这么一组option对象，你刚添加给第一个成功了，下一轮循环就又把这一组option对象添加到另外一个select对象中去了，所以最后一个select对象才会显示出正常的添加结果。

dojo.clone(optionElementList[i])这个是复制一个<option>对象出来，整个页面中就会多出来一组option对象，这样每次循环添加的option对象都是不一样的，所以才能出现正确的添加结果。