单击jquery时，.remove不会删除列表项

Question

为什么点击时不会移除<li>？

$(".ListOfItems a").click(function () {
   $(this).parent('li').remove();
});

这是我在列表中添加列表项目的地方：

      <ul class="ListOfItems">
      </ul>

有了这个：

     var list = $(".ListOfItems");

     liToAdd = ("<li id = " + itemtoadd + " class = \"itemAdd\">" + name + 
     "<a href=\"#\" > Remove me</a></li>");
     list.append(liToAdd );

一切都很好，但我无法删除<li>。

Answer 1

尝试对动态DOM元素使用on（）方法

$('.ListOfItems').on('click','a',function() {
    $(this).parent().remove();
});

http://api.jquery.com/on/

CodePen： http://codepen.io/Maksim/pen/LEAhv

Answer 2

使用.on

$(document).on('click, ".ListOfItems a", 'function () {
     $(this).parent('li').remove();
});