Using the Jquery closest() function?

Question

Here's my HTML:

<tr>
    <td class="show_r3c">click here</td>
</tr>
<tr class="r3c">
    <td>This is what I'd like to display</td>
</tr>

And I have currently got this JQuery code,

    $(document).ready(function(){
        $(".r3c").hide();        
        $('.show_r3c').click(function() { 
                         $(this).closest('.r3c').toggle(); 
                         return false; 
        });
   });

For some reason the closest() function isn't working, and it won't toggle the table row .r3c - I've tried using parent and other alternatives but can't get it working either :(

Apologies for the silly question, and something similar to a problem I've had before. Just wondering, What's the best solution for this ?

Thanks!

Damo · Accepted Answer · 2009-08-28 13:37:12Z

23

closest() finds the closest parent not the parents-siblings-children.

You want something like:

$(document).ready(function(){
    $(".r3c").hide();

    $('.show_r3c').click(function() { 
        $(this).closest('table').find("tr.r3c").toggle(); return false; 
    });
});

answered Aug 28, 2009 at 13:37

Damo

11.6k6 gold badges59 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Ryan White Over a year ago

Since the question was 'Using the Jquery closest() function?' this is the best answer for sure. The other answers are mroe about how to traverse the DOM using jquery without using closest :)

Christian C. Salvadó · Accepted Answer · 2009-08-28 13:40:52Z

13

Try with:

$('.show_r3c').click(function() {
  $(this).parent('tr').next('tr.r3c').toggle();
  return false;
});

answered Aug 28, 2009 at 13:40

Christian C. Salvadó

831k185 gold badges929 silver badges845 bronze badges

Comments

stefita · Accepted Answer · 2009-08-28 13:33:39Z

4

perhaps this would work:

$(document).ready(function(){
    $(".r3c").hide();

    $('.show_r3c').click(function() { 
        $(this).parent().siblings(":first").toggle(); 
        return false; 
    });
});

answered Aug 28, 2009 at 13:33

stefita

1,7932 gold badges20 silver badges35 bronze badges

Collectives™ on Stack Overflow

Using the Jquery closest() function?

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related