select the #targetElem siblings(div class="content") animate

Question

the html is

<a class="minimize" href="#targetElem" >Min</a>
<div id="targetElem">
<p class="handler"></p>
  <div class="content">
  content area
  </div>
</div>

the javascript is the following code

$(document).ready(function(){ 
    $('a.minimize').click(function() {
      $($(this).attr('href')).siblings(".content").slideToggle("slow");
    });
});

what i want is when click on the a href class minimize , the target of the href (#targetElem)no change, but select the #targetElem siblings(div class="content") animate, bcos i want to use them over and over,i don't want to add a lot of code to the .js file like the following code:

$(document).ready(function(){ 
    $('a.minimize').click(function() {
    $('#targetElem').siblings(".content").slideToggle("slow");
    });
    $('a.minimize1').click(function() {  
    $('#targetElem1').siblings(".content").slideToggle("slow");
    });  
    $('a.minimize2').click(function() {    
    $('#targetElem2').siblings(".content").slideToggle("slow");
    });  
    $('a.minimize3').click(function() {    
    $('#targetElem3').siblings(".content").slideToggle("slow");
    });  

});

so how can i do this???

Answer 1

Youre doing right, except that .content is not a sibling to the targetElem, but a child:

$(document).ready(function(){ 
    $('a.minimize').click(function() {
      $($(this).attr('href')).children(".content").slideToggle("slow");
    });
});

Answer 2

sibling are all the element at the same level (brothers), and the children ar all the element inside the surrent element, but just one level depth (direct childs).

if you want go down all the hierarchy of an element you have to you the find method