在javascript中动态添加多个字段

Question

我是javascript初学者。我需要动态添加具有相同id的现有形式的多字段。

第一个字段有这个名字：

<input type="text" name="myInputs[0][address]">
<input type="text" name="myInputs[0][whitelist]">

点击“添加其他文字输入”时，我想要一个带

的新字段

<input type="text" name="myInputs[1][address]">
<input type="text" name="myInputs[1][whitelist]">

再次点击“添加其他文字输入”

<input type="text" name="myInputs[2][address]">
<input type="text" name="myInputs[2][whitelist]">

提交帖子时，只发布第一个字段：

<input type="text" name="myInputs[0][address]">
<input type="text" name="myInputs[0][whitelist]">

这里是代码：

       <script>
            var counter = 1;
            var limit = 10;

            function addInput(divName){
                if (counter == limit)  {
                    alert("You have reached the limit of adding " + counter + " inputs");
                }
                else {
                    var newdiv = document.createElement('div');
                    newdiv.innerHTML = "Entry " + (counter + 1) + " <br><input type='text' name='myInputs["+ (counter + 1) +"][address]'><input type='text' name='myInputs["+ (counter + 1) +"][whitelist]'>";
                    document.getElementById(divName).appendChild(newdiv);
                    counter++;
                }
            }
        </script>

             <div id="dynamicInput">
                       Entry 1<br>
                                  <input type="text" name="myInputs[0][address]">
                                  <input type="text" name="myInputs[0][whitelist]">
             </div>
             <input type="button" value="Add another text input" onClick="addInput('dynamicInput');">