CODEWITHSUNDEEP
jquery
Phillip Senn
Phillip Senn

Reputation: 47595

How do I get a table after a hyperlink?

A table isn't a sibling to a hyperlink is it? I have:

<a href="JavaScript:;">Show me the table</a>
<table class="hidden">
...
</table>

Q: What jQuery selector do I use to get the table following the anchor tag?

$('a').click(function() {
   $(this).something.slideDown();
});

Upvotes: 0

Views: 63

Answers (3)

Rob Cowie
Rob Cowie

Reputation: 22619

I strongly suggest not assuming your table will always be adjacent. It may be right now, but if you need to move it for some reason your code will break.

Save yourself some trouble and store an identifier for the table in the anchor element. One option is to use data attributes to store the selector.

<a href="#" data-target-table="#table1">Show me the table</a>
<table id="table1" class="hidden">
    ...
</table>

and get it using .data()

$('a').click(function() {
    var $this = $(this);
    var $table = $($this.data('targetTable'));
    $table.something.slideDown();
});

An alternative is to have a common class on each element and use that to select the table.

Upvotes: 1

citizen conn
citizen conn

Reputation: 15390

$('a').click(function(){
    $(this).next().slideDown();
});

Upvotes: 3

Joey C.
Joey C.

Reputation: 2377

You might either use .next() or .siblings() to access an element at the same level in the DOM.

So in your example you could use:

 $('a').click(function() {
    $(this).siblings('table').slideDown();
 });

Upvotes: 2

Related Questions