HOW TO TOGGLE NEXT HIDDEN DIV ON CLICK

jacob rasel

Total Post:88

Points:616
Posted by  jacob rasel
 958  View(s)
Ratings:
Rate this:

I have the following setup. I want to toggle the expanded div when clicking the expander link. I only want to expand the div directly next to the link though. How can I do this?

<a class="expander" href="#"><?php echo get_the_title($post->ID); ?></a>
<div class="expanded">
    content here
</div>
 
<a class="expander" href="#"><?php echo get_the_title($post->ID); ?></a>
<div class="expanded">
    content here
</div>
 
<a class="expander" href="#"><?php echo get_the_title($post->ID); ?></a>
<div class="expanded">
    content here
</div>

Here's my jquery:

$('.expander').click(function() {
    event.preventDefault();
    $(this).siblings('expanded').toggle();
});

  1. Hugh Jackman

    Post:51

    Points:359
    Re: How to toggle next hidden div on click

    Use next instead. I think this should work:

    $('.expander').click(function() {
        $(this).next('.expanded').first().toggle();
    }); 

      Modified On Apr-09-2018 12:22:05 AM

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!