添加和删​​除jquery li元素

Question

我想添加li元素它工作正常，但删除不适用于新元素。 我在开始时有三个li元素，因为删除功能起作用。

使用我的“添加”功能，我使用相同的类创建Li元素，为什么它会为新的元素工作？

http://jsfiddle.net/3c96gduL

$(document).ready(function(){
    $("#add_li").click(function (){
        $("ol").append("<li>" + $("input").val() + "<a href=\"#\" class=\"remove\">X</a></li>");
    });
    $("#remove_li").click(function(){
        $("li:last").remove();
    });
    $(".remove").click(function(){
        $(this).parents('li').remove();
    });

    var log = $('.remove');
    console.log(log);
    console.log(jQuery);    

});

Answer 1

您需要使用event delegation将事件附加到动态添加的dom。

  

事件委托允许我们将单个事件侦听器附加到父元素，该元素将为匹配选择器的所有后代触发，无论这些后代现在是存在还是将来添加。

$("ol").on('click','.remove',function(){
    $(this).parents('li').remove();
});

Working Demo