About the "index",i think it is right, when it is wrong. i do not know why
<p>Look at the code:</p>

<pre><code>&lt;div class="test"&gt;
  &lt;p&gt;&lt;a href="#"&gt;1&lt;/a&gt;&lt;a href="#"&gt;2&lt;/a&gt;&lt;a href="#"&gt;3&lt;/a&gt;&lt;/p&gt;
  &lt;div&gt;1&lt;/div&gt;
  &lt;div&gt;2&lt;/div&gt;
  &lt;div&gt;3&lt;/div&gt;
&lt;/div&gt;
&lt;script language="javascript" type="text/javascript"&gt;
$(".test a").each(function(index,element){
    $(element).click(function(){
        $(element).toggleClass("hover");                    // here works well
        $(".test div:eq(index)").slideToggle();             // here words wrong!
        });
});
&lt;/script&gt;
</code></pre>

<p>above code, i think it should work well,but i am wrong. i do not know why. 
the second event:the "div" only slidetoggle the first, other div do not slidetoggle, whenever you click which "a" tag. </p>

<p>another way is wrong the same:</p>

<pre><code>&lt;script language="javascript" type="text/javascript"&gt;
$(".test a").click(function(){
    x = $(this).index();
    $(this).toggleClass("hover");                   // here works well
    $(".test div:eq(x)").slideToggle();             // here words wrong!
    });
&lt;/script&gt;
</code></pre>

<p>by the way, i test <code>.get(index)</code> method too, the browser says: it does not support the method!</p>

<p>is there a master to solve this difficulty?</p>

<p>guys! Through testing again and again, i finally figured out. Let me show the correct code:</p>

<p>plan A:</p>

<pre><code>&lt;script language="javascript" type="text/javascript"&gt;
$(".test a").each(function(index,element){
    $(element).click(function(){
        $(element).toggleClass("hover");
        $(".test div").eq(index).slideToggle();
        });
    });
&lt;/script&gt;
</code></pre>

<p>plan B:</p>

<pre><code>&lt;script language="javascript" type="text/javascript"&gt;
$(".test a").click(function(){
    x = $(this).index();
    $(this).toggleClass("hover");
    $(".test div").eq(x).slideToggle();
    });
&lt;/script&gt;
</code></pre>

<p>OR Just:</p>

<pre><code>&lt;script language="javascript" type="text/javascript"&gt;
$(".test a").click(function(){
    $(this).toggleClass("hover");
    $(".test div").eq($(this).index()).slideToggle();
    });
&lt;/script&gt;
</code></pre>

<p>plan C: come from @Šime Vidas `s method</p>

<pre><code>&lt;script language="javascript" type="text/javascript"&gt;
$(".test").on("click","a",function(){
    $(this).toggleClass("hover");
    $(this).parent().siblings().eq($(this).index()).slideToggle();
    });
&lt;/script&gt;
</code></pre>

<p>I test <code>:eq(" + index + ")</code> it does not work. but <code>.eq(index)</code> works well!
is that mean in selector <code>:eq(n)</code>,n could not be variable, but, in method <code>.eq(n)</code>, n can be variable?</p>

<p>I test <code>.on</code> method, it does not work with jquery-1.6.4.min, but works well with jquery-1.7.1.min.</p>

<p>There is another interesting thing:Plan B, the first code, the <code>x</code> variable is always be <code>0</code> in some more complicated condition, but the sencond code has no this problem. i can not figure this out yet.</p>

<p>thank you all guys, for all your methods and help, without you, i could not figure this out.</p>
