Javascript 如何为动态元素触发任何事件？

我有一个：

function fillCard()
{
    const persons = document.getElementsByClassName("fillCard");
    if(persons !== null)
    {
        for (var i = 0; i < persons.length; i++)
        {
            persons[i].addEventListener("click", function(event){
                event.preventDefault();
                var getUrl = this.getAttribute("href");
                var url = new URL(location.origin + getUrl);
                var Id = url.searchParams.get("id");
                fetch(getUrl + "&id=" + Id + "&do=fillCard")
                .then(response => response.json())
                .then(data => {
                    document.getElementById("frm-newCard-lastname").value = data[0];
                    document.getElementById("frm-newCard-firstname").value = data[1];
                    document.getElementById("frm-newCard-dateofbirth").value = data[2];
                    document.getElementById("frm-newCard-phone_number").value = data[3];
                    document.getElementsByName("identifier")[0].value = data[4];
                });
            });
        }
    }
}

函数fillCard（）
{
const persons=document.getElementsByClassName（“fillCard”）；
如果（人！==null）
{
对于（变量i=0；iresponse.json（））
。然后（数据=>{
document.getElementById（“frm newCard lastname”）。值=数据[0]；
document.getElementById（“frm newCard firstname”）。值=数据[1]；
document.getElementById（“frm新卡出生日期”）.value=data[2]；
document.getElementById（“frm-newCard-phone_number”）。value=数据[3]；
document.getElementsByName（“标识符”）[0]。值=数据[4]；
});
});
}
}
}

问题是-类名为fillCard的元素是由AJAX动态创建的。此时事件侦听器不工作。如何正确触发事件？提前感谢您的帮助。

解决方案：

function fillCard()
{
    document.addEventListener("click", function(e){
        if(!e.target.matches('.fillCard'))
            return;
        
        e.preventDefault();
        var getUrl = e.target.getAttribute("href");
        var url = new URL(location.origin + getUrl);
        var Id = url.searchParams.get("id");
        fetch(getUrl + "&id=" + Id + "&do=fillCard")
                .then(response => response.json())
                .then(data => {
                    document.getElementById("frm-newCard-lastname").value = data[0];
            document.getElementById("frm-newCard-firstname").value = data[1];
            document.getElementById("frm-newCard-dateofbirth").value = data[2];
            document.getElementById("frm-newCard-phone_number").value = data[3];
            document.getElementsByName("identifier")[0].value = data[4];
        });
    });
}

---

在创建元素后附加事件侦听器created@JeremyThille怎么用？我意识到有几个主题有着相同的问题，但我无法理解。我不知道它们是如何产生的，所以我不能理解tell@JeremyThille我添加了更多的代码。