用JS添加新的下拉菜单

我希望使用JS添加一个新的下拉菜单与按钮单击，其中下拉菜单的元素创建一个文本框时单击

<input id="btnAdd" type="button" value="Add" />
<br />
<br />
<div id="TextBoxContainer">
</div>
<br />

JS:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
    var click_number = 0;
    $("#btnAdd").bind("click", function () {
        var div = $("<div />");
        var input = $("<div id='search'><label>Input &nbsp;<textarea rows='1' name='input_"+ click_number +"'><?php echo $_POST['input_". click_number ."']; ?></textarea></label></div>");
        input.appendTo('#TextBoxContainer');
        div.html(RemoveDynamicTextBox());
        $("#TextBoxContainer").append(div);
        console.log(click_number);
        click_number++;
    });
    $("body").on("click", ".remove", function () {
        for ($i=0; $i<2; $i++){
            $('#search').remove();
        }
        click_number--;
        console.log(click_number);
    });
});
function RemoveDynamicTextBox() {
    return "<input id='search' type='button' value='Remove' class='remove' />";
}
</script>

目前，上面的代码添加了一个文本框和删除按钮，每个按钮单击。然后，我使用文本框作为post变量输入，同时将这些内容包含在一个带有提交按钮的表单中，这样我就可以在mysqli查询中使用输入。我用点击数增加post变量的名称，以便在后面的查询中区分输入。

我是新的JS(所以如果我没有提供足够的信息，让我知道，我会编辑)，但我想有很多不同的选项输入文本框在一个下拉菜单中添加了按钮单击。然后，当用户单击下拉菜单中的元素时，它将作为文本框输入添加。因此，每次用户单击添加按钮时，都会出现一个新的下拉菜单。因此，理论上，我可以有两个相同的输入，它们的名称中有不同的增量，可以稍后进行区分。此外，我将有删除按钮删除添加的文本框和下拉菜单与最后一个"添加"按钮点击。