Javascript 如何获取创建文档后添加的已单击元素的ID？

我得到一个li的id，点击时如下所示：

        $("#repository-tabs li").on("click", function(e) {
            alert(this.id);
        });

简单，问题是，我在之后动态添加li元素：

        $("#add-tab").click(function() {
            tabs = $("#repository-tabs li").length - 1;
            append_at = tabs - 2;
            $("#repository-tabs li:eq(" + append_at + ")").after('<li id="repository-tab-' + tabs + '" class="tab col s3 z-depth-5"><a class="white green-text text-darken-2 waves-effect waves-light" href="javascript:void(0);">Repositório ' + tabs + '</a></li>');
        });

$（“#添加选项卡”）。单击（函数（）{
tabs=$（“#存储库tabs li”）.length-1；
在=制表符-2处追加_；
$（“#repository tabs li:eq（“+append_at+”））。在（“
”）之后；
});

---

现在，当我单击添加的li元素时，不会触发任何事件。那么，如何获取未来单击项目的ID

不要将事件直接应用于tab元素；相反，将其应用于父级并将其委派

on（）

还有第二个可选参数

selector

，用于过滤触发事件的选定元素的后代

$("#repository-tabs").on("click", "li", function() {
  alert(this.id);
});

从：

委托事件处理程序的优点是，它们可以处理来自子元素的事件，这些子元素在以后添加到文档中。通过选择在附加委派事件处理程序时保证存在的元素，可以使用委派事件来避免频繁附加和删除事件处理程序