Javascript $。在（”单击“）上，函数（）不单击。元素是动态生成的

我有一个函数，可以生成，需要的是，一个可点击的检查注释。没有问题，这就是生成的html代码的样子

<span class="edit">
   <i class="fa fa-pencil" aria-hidden="true"></i>
</span>

警报未显示。是否知道可能有什么问题？

使用事件委派：

$(document).on('click', '.edit', function(){
    //function to edit tasks
    alert("The check was clicked.");
});

var c=$（'#c'）；
$（'#添加'）。在（'单击'，函数（）上）{
c、 附加（'Hello'）；
});
$（文档）。在（'单击'，'编辑'，函数（）上）{
//用于编辑任务的函数
警报（“已单击检查”）；
})；

div{
边缘顶部：10px；
}
.编辑{
宽度：25px；
高度：25px；
保证金：0px 10px 10px 0px；
背景：#000；
颜色：#fff；
填充：10px；
}

添加

为什么

事件委派

？@wow，OP提到

。edit

是动态生成到DOM的。如果我遗漏了他们的一点问题，请告诉我。哦，我遗漏了关于静态祖先的部分。需要更加注意。但是谢谢你！我从去年开始就一直坚持这一点（对不起，我不得不这么做）。

$(document).on('click', '.edit', function(){
    //function to edit tasks
    alert("The check was clicked.");
});