Jquery Hide parent div onclick

Question

我想在单击子div 时隐藏父div。单击"添加更多"按钮时，我已经附加了div。简而言之，当单击div 中的"X"时，它的父div 应该隐藏。这是我的小提琴

$( "#appenddiv" ).on( "click", function() {
     $( ".uploadimg" ).append( "<div class='image'><div class='delete'>X</div></div>" );
});
$(".delete").on("click",function(){
    $(this).parent().hide();
});

Answer 1

你的代码不起作用的原因是，该元素被动态附加到 DOM 中，因此我们必须使用 event delegation 来使代码工作。

尝试

$(".uploadimg").on("click",".delete",function(){
    $(this).parent().hide();
});

演示

Answer 2

您需要动态生成的 DOM 的事件委派：

  $("body").on("click",'.delete',function(){
   $(this).parent().hide();
});

工作演示

Answer 3

您应该对动态创建的项目使用扩展

 $(document).on("click",".delete" function () {
        $(this).parent().hide();
    });