I have this one:
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];
});
});
}
}
}
The problem is - those elements with class name fillCard are created dynamically by AJAX. The event listener does not work then. How to trigger the event properly? Thank you in advance for help.