javascript - Jquery Hide parent div onclick - Stack Overflow

admin管理员组

文章数量:1322850

I want to hide parent div when a child div is clicked.I have appended the div when "add more" button is clicked.In short when "X" in div is clicked its parent div should hide.Here is my Fiddle

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

I want to hide parent div when a child div is clicked.I have appended the div when "add more" button is clicked.In short when "X" in div is clicked its parent div should hide.Here is my Fiddle

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

• javascript
• jquery

Share Improve this question Follow asked Mar 5, 2014 at 11:13 abinayaabinaya 9399 bronze badges 2

• 2 delegation is the keyword you are looking for – A. Wolff Commented Mar 5, 2014 at 11:14
• And you can be selective too: $(this).closest(".image").hide() – mplungjan Commented Jul 20, 2018 at 14:37

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

The reason why your code not working is, That element is being appended in to the DOM dynamically, so we have to use event delegation to make the code work..

Try,

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

DEMO

You need event delegation for dynamically generated DOM:

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

Working Demo

you should use deligates for dynamically created items

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

本文标签： javascriptJquery Hide parent div onclickStack Overflow