javascript - 动态<a> </a>不能与jquery一起运行

我想为照片制作一个网站。

在使用jquery函数（.append）创建的动态div中，有以下锚点：

<a href='#' style='color:green;' id='"+this.foto_id+"' data-id='"+this.foto_id+"' class='modificaDataFoto modificaDataFoto"+this.foto_id+"'>Modifica</a>

该页面正常加载，如果使用浏览器调试器，我会看到所有HTML代码，包括数据库中的所有动态数据...

但是，如果我尝试在jquery函数中设置锚的类，则它不会运行：

$('.modificaDataFoto').bind('click', function(event) {
    event.preventDefault();
    var idFotoModifica= $(this).attr("data-id");
    console.log(idFotoModifica);
    $("dataFoto"+idFotoModifica).focus();
    $("dataFoto"+idFotoModifica).css("color", "red");
    $(this).attr("class", "modificaDataFotoConferma");
});

为什么该功能不起作用？

最佳答案

使用此代码：

$(document).on('click', '.modificaDataFoto', function(event) {
    event.preventDefault();
    var idFotoModifica = $(this).attr("data-id");
    console.log(idFotoModifica);
    $("dataFoto"+idFotoModifica).focus();
    $("dataFoto"+idFotoModifica).css("color", "red");
    $(this).attr("class", "modificaDataFotoConferma");
});