Javascript 单击外部文件中未触发的事件

我正在尝试创建一个库代码，可以在我所有的html页面上使用。 我对JS非常陌生，这是我第一次尝试像库函数一样编写代码

我有一个文本字段和它旁边的一个按钮，点击按钮会在下面添加另一个文本字段和它旁边的一个按钮，这也会删除前一行中的按钮

我设法在同一行中创建了一个按钮，并在下一行中添加了文本字段，但新添加的方法的按钮单击不适用于纯JS，因此我尝试使用jquery“on”click事件。出于某种原因，在我的情况下，它不会被触发。 不知道我错过了什么

外部文件中的代码

var addAnother = {
    addAnotherField: function (eventTrigger, fieldContainer, arrayField) {
        console.log("called");
        var eventTrigger = eventTrigger;
        console.log("ready called", eventTrigger);
        $(document).on('click', eventTrigger, function (e) {
            console.log("click called");
            var buttonText = this.value;
            var div = document.getElementById(fieldContainer);
            var element = document.getElementById(eventTrigger);
            element.parentNode.removeChild(element);
            var input = document.createElement("input");
            input.type = "text";
            input.name = arrayField;
            div.appendChild(document.createElement("br"));
            div.appendChild(input);
            var button = document.createElement("input");
            button.type = "button";
            button.id = eventTrigger;
            button.value = buttonText;
            div.appendChild(button);
        });
    }
}

HTML代码

$(document).ready(function () {
    addAnother.addAnotherField("addAnother", "addAnotherContainer", "fieldArray[]");
});

工作JS代码：

下一步按钮非工作代码JS

使用Jquery： 这就是你想要的吗：

/** this part will be located in another file added as a js library */
function addAnother(elem) {
    var text = $("#addAnotherField").clone();
    $("<br/>").insertBefore($("#addAnother"));
    text.insertBefore($("#addAnother"));

}
/* this part will be coded below the above code file in the html file*/

$(document).ready(function () {
    $('#addAnother').click(function () {
        addAnother(this);
    });
});

/**此部分将位于作为js库添加的另一个文件中*/
函数addother（elem）{
var text=$（“#addAnotherField”）.clone（）；
$（“
”）.insertBefore（$（“#添加另一个”）；
text.insertBefore（$（“#添加另一个”）；
}
/*此部分将在html文件中的上述代码文件下面进行编码*/
$（文档）.ready（函数（）{
$（“#添加另一个”）。单击（函数（）{
再加一个（这个）；
});
});