添加和删除jquery-li元素

add and remove jquery li element

本文关键字:元素 jquery-li 删除 添加      更新时间:2023-12-03

我想添加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);    
});

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

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

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

工作演示