All geek questions in one place

JQuery - Unable to hide parent

I seem to have stumbled upon a problem with a very simple task. I am trying to hide the parent div when clicking on the child.

Here is my HTML;

<div class="wave-wrap"><div class="wave">click me</div></div>

<div class="wave-wrap"><div class="wave">click me</div></div>

<div class="wave-wrap"><div class="wave">click me</div></div>

Here is my jQuery;

$('.wave').click(function() {
alert($(this).parent().html());                   
$(this).parent().hide('slow');
});

The warning seems to indicate that I have the correct selector, but the parent div refuses to hide. Any ideas why?

+3
source share
2 answers

Give it a try $(this).closest(".wave-wrap").hide().

+1
source

Your code works very well. Take a look at the following example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript">
            $(document).ready(function(e) {
                $('.wave').click(function() {
                    alert($(this).parent().html());                   
                    $(this).parent().hide('slow');
                });
            });
        </script>    
    </head>

    <body>
        <div class="wave-wrap"><div class="wave">click me</div></div>

        <div class="wave-wrap"><div class="wave">click me</div></div>

        <div class="wave-wrap"><div class="wave">click me</div></div>    
    </body>
</html>
0
source

Source: https://habr.com/ru/post/1789486/

More articles:


All Articles