Javascript 如何将动态下拉列表插入到动态标记中？

我尝试过创建动态下拉列表，但不起作用

当我单击“添加行”按钮时，它会发生如下变化

我真的很想更改添加的下拉列表，就像第一个列表一样，但是没有数据

这是代码

    <button id='btn-add-row'>Add Row</button>
    <button id='btn-delete-row'>Delete Row</button>
       <script src="//code.jquery.com/jquery.min.js"></script>
       <script>
        $('#btn-add-row').click(function() {
          $('#mytable > tbody:last').append('<tr><td><input type="checkbox"><td><input type="text"></td><td><input type="text"></td><td><input type="text"></td></tr>' +
        '<tr><td><td></td><td><select id="slist"></select></td><td></td></tr>');
      });
        $('#btn-delete-row').click(function() {
          $('#mytable > tbody:last > tr:last').remove();
          $('#mytable > tbody:last > tr:last').remove();
       });

      setattr();

      function setattr(){
          var myobject = {
            ValueA : 'Text A',
            ValueB : 'Text B',
            ValueC : 'Text C'
        };

        var select = document.getElementById("slist");
        for(index in myobject) {
            select.options[select.options.length] = new Option(myobject[index], index);
        }

        if(select.options.length > 0) {
          //  window.alert("Text: " + select.options[select.selectedIndex].text + "\nValue: " + select.options[select.selectedIndex].value);
        }
        else {
            window.alert("Select box is empty");
        }
      }
      </script>

添加行
删除行
$（“#btn添加行”）。单击（函数（）{
$（'#mytable>tbody:last'）。追加（''+
'');
});
$（“#btn删除行”）。单击（函数（）{
$（'#mytable>tbody:last>tr:last'）.remove（）；
$（'#mytable>tbody:last>tr:last'）.remove（）；
});
setattr（）；
函数setattr（）{
变量myobject={
ValueA:'文本A'，
ValueB:'文本B'，
值C:'文本C'
};
var select=document.getElementById（“slist”）；
用于（myobject中的索引）{
select.options[select.options.length]=新选项（myobject[index]，index）；
}
如果（选择.options.length>0）{
//window.alert（“Text:+select.options[select.selectedIndex].Text+”\n值：“+select.options[select.selectedIndex].value”）；
}
否则{
window.alert（“选择框为空”）；
}
}

---

谢谢您的帮助。

我的解决方案是使用DOM方法并发布到

---

实际上，我需要在下拉列表的前面添加textarea行，所以我现在修改代码=）

var myTable=document.getElementById("mytable");
$('#btn-add-row').click(function() {
 row=mytable.insertRow(mytable.rows.length);
cell=row.insertCell(row.length);
cell=row.insertCell(row.length);
cell=row.insertCell(row.length);
dropDownBox=document.createElement("select");
buildDropDownBox(dropDownBox);
cell.appendChild(dropDownBox);
cell=row.insertCell(row.length);
});
$('#btn-delete-row').click(function() {
 myTable.deleteRow(mytable.rows.length-1);
});
function buildDropDownBox(select)
{
  var myobject = {
        ValueA : 'Text A',
        ValueB : 'Text B',
        ValueC : 'Text C'
    };
    for(index in myobject) {
        select.options[select.options.length] = new Option(myobject[index], index);
    }
}