CODEWITHSUNDEEP
jquery
nwkeeley
nwkeeley

Reputation: 1437

How to access "next" div in row of elements

Below is the example code. What I want to happen is when I click the "toggle" link above the particular indented div I want it to toggleSlide the div.indented below it but not affect the other indented elements... I cannot change the layout of the div's so I need to figure out how to access it with jquery.

If they were in the same div with each other I suspect I could use:

jQuery(this).siblings(".indented").slideToggle(500);

So looking for that sort of functionality.... could I use like .next()? But that doesn't seem to work either.

<script type="text/javascript">
    jQuery(document).ready(function() {
      jQuery(".link").click(function() {
         jQuery(".indented").slideToggle(500);
      });
    });
</script>


<div class="comment">
    <div class="outter">
        <div class="inner">
            <div class="links">
                <a class="link">Toggle</a>
            </div>
        </div>
    </div>
</div>

<div class="indented">
    <div class="comment">Some comment</a>
    <div class="comment">Another comment</div>
</div>

<!-- Comment #2 --->

<div class="comment">
    <div class="outter">
        <div class="inner">
            <div class="links">
                <a class="link">Toggle</a>
            </div>
        </div>
    </div>
</div>

<div class="indented">
    <div class="comment">Some comment</a>
    <div class="comment">Another comment</div>
</div>

<!-- Comment #3 --->

<div class="comment">
    <div class="outter">
        <div class="inner">
            <div class="links">
                <a class="link">Toggle</a>
            </div>
        </div>
    </div>
</div>

<div class="indented">
    <div class="comment">Some comment</a>
    <div class="comment">Another comment</div>
</div>

Upvotes: 0

Views: 79

Answers (1)

thecodeparadox
thecodeparadox

Reputation: 87073

jQuery(document).ready(function() {
      jQuery(".link").click(function() {
         jQuery(this).closest(".comment").next('.indented').slideToggle(500);
      });
    });

Upvotes: 2

Related Questions