Jquery div expands all divs on page
<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery(".content").hide();
        jQuery(".link").click(function()
        {
          jQuery("div.content").slideToggle(500);
        });;
    });
开发者_如何学C</script>
How to expand only the div which is linked to the specific link?
Edit: Its done like this
<div class="comment">
   <div class="bar">
      <a class="link">#</a>
    </div>
</div>
<div class="content">
  <div class="comment">
   <div class="bar">
      <a class="link">#</a>
    </div>
  </div>
</div>
EDIT 2:
You changed your HTML. Now do this:
jQuery(this).closest('div.comment').next('div.content').slideToggle(500);
But wait! Now you have 2 different div.link elements in different relation to .content elements. Is this your actual HTML markup?
You could also do this:
jQuery(this).closest('div.content').slideToggle(500);
Please provide your actual HTML.
EDIT:
Based on updated question, do this:
jQuery(this).parents('div.blaat1').eq(1).next().slideToggle(500);
How to expand only the div which is linked to the specific link?
How are they linked?
If the div is a descendant, do this:
jQuery(this).find('div.content').slideToggle(500);
If the div is a an ancestor, do this:
jQuery(this).closest('div.content').slideToggle(500);
If the div is the next sibling, do this:
jQuery(this).next().slideToggle(500);
If the div is the previous sibling, do this:
jQuery(this).prev().slideToggle(500);
Without seeing your HTML structure, we can only guess at the solution.
For this HTML:
<div class="blaat1">
   <div class="blaat1">
      <a class="link">#</a>
    </div>
   <div class="blaat2">
      <a class="link">#</a>
    </div
</div>
<div class="content">
  <div class="otherdivs">
      <div class="blaat1_div"><p>Hi – I'm blaat 1</p></div>
      <div class="blaat2_div"><p>Hi – I'm blaat 2</p></div>
  </div>
</div>
Use this JS:
<script type="text/javascript">
    $(document).ready(function() {
        $(".content").hide();
        $(".link").click(function() {
          var blaat = $(this).parent().attr("class");
          $(blaat+"_div").slideToggle(500);
        });;
    });
</script>
I haven't tested that, but it should work.
Try this:
$(".link").click(function(){
    $(this).parents('div.content').slideToggle(500);
});;
 
         加载中,请稍侯......
 加载中,请稍侯......
      
精彩评论