CODEWITHSUNDEEP
jqueryparentsiblings
bernk
bernk

Reputation: 1165

How can I target a sibling element that is not of the same type?

I want all links with class play to show the one and only video element present in their container.

The simplified HTML looks like this:

<div>
    <a class="play">Play</a>
    <video>…</video>
</div>

And I'm thinking along these lines for the jQuery, but don't understand how to target an element inside of parent:

$('.play').click(function(e){
    e.preventDefault();
    var target = $(this).parent().$('video');
    t.show();
})

Upvotes: 0

Views: 97

Answers (2)

techfoobar
techfoobar

Reputation: 66663

You can use:

$(this).parent().find('video:first');

OR

$(this).siblings('video');

BTW, your HTML is incorrect, it should be:

<a class="play">Play</a> <!-- no need for '.' before the class attribute value -->

Upvotes: 2

CodingIntrigue
CodingIntrigue

Reputation: 78535

You can use .find:

$(this).parent().find("video");

Or .siblings:

$(this).siblings("video");

Upvotes: 2

Related Questions