CODEWITHSUNDEEP
jquery
user2310422
user2310422

Reputation: 555

How to hide the outer parents in Jquery

Below is my code, my goal is when the user click the <a> which is in 'child_2', I want to hide $(this) class="parent". How can I achieve this? 

<div class="parent">
    <div class="child_1">
    </div>

    <div class="child_2">
        <div>
            <ul>
                <li><a href="#">Click Me</a></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>
    </div>

    <div class="child_3">
    </div>

</div>

Upvotes: 0

Views: 72

Answers (2)

Mark Kramer
Mark Kramer

Reputation: 3214

You can use this line: $('.child_2 a').click(function() {$(this).parent().hide()});

Here is a working JSFiddle

This will hide the parent element of whichever link you click.

Upvotes: 0

Claudio Redi
Claudio Redi

Reputation: 68400

Use closest

$(this).closest('.parent').hide();

For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.

Upvotes: 5

Related Questions