Javascript 如何使列表项在附加时可单击？

我现在会尽量把问题简单化，因为我真的不知道该怎么做

我必须更改html文件中无序的列表元素

一,。在javascript中为每个新对象创建一个DOM片段

二,。移除ul中的原始批次

三,。将每个新的DOM片段追加到ul中

四,。使每个新元素都可以再次单击

单击某个元素将删除ul的内容，并将其替换为新批次 根据单击的元素，批次从0到6个元素不等

我遇到的第一个问题是，没有办法创建多个元素，可以一次点击，因为循环不起作用，所以现在我只是重复我的功能

    $( "#choices" ).children().eq(0).click(function() {
        selectChoice(allChoices, $( "#choices" ).children().eq(0).text());
    });

    $( "#choices" ).children().eq(1).click(function() {
        selectChoice(allChoices, $( "#choices" ).children().eq(1).text());
    });
    // more li elements to make clickable

第二，当你删除一个li元素并放回一个新元素时，你必须让它可以点击，但是因为你不知道元素的数量，for循环不起作用，我不能在创建时添加函数。并非所有元素也遵循相同的格式，因此简单地修改现有li不是一个选项

---

有没有一种我不知道的简单方法可以实现我想要的功能？

您使用的是jQuery，对吗

研究关于方法的问题。你应该可以做一些类似的事情

$('#choices').on('click', 'li', function(ev) {
   ... do your thing ...
});

---

在选项下添加新的li时，此事件绑定将自动添加到新li

您正在使用jQuery，对吗你怎么看？如果前一批中的每个元素都打开了一组新的不同元素，这还会起作用吗？在整个列表中，一个元素的事件不会是相同的吗？只要您不扔掉容器，它就可以正常工作。