Question

I’m trying to fire on my Slide toggle but is not working as is expected. Each click works only for the first div.

HTML Code :

<div id="toggle">
    <span id="down"></span>
    <a id ="slide" href="#">Passende Produkte zum Gutschein</br></a>
    <div id="inner">text tetxtext</div>

    <span id="down"></span>
    <a id ="slide" href="#">Passende Produkte zum Gutschein</a>
    <div id="inner">text tetxtext</div>
</div>

JS Code :

$('a').click(function() {
    $('#inner').slideToggle('fast');    
});

CSS :

#inner {
    display:none;
}

My result is located here.

Answer 1

IDs must be unique, you should use classes instead, also you haven’t loaded jQuery in the jsfiddle.

<div id="toggle">
    <span class="down"></span>
    <a class="slide" href="#">Passende Produkte zum Gutschein</br></a>
    <div class="inner">text tetxtext</div>

    <span class="down"></span>
    <a class="slide" href="#">Passende Produkte zum Gutschein</a>
    <div class="inner">text tetxtext</div>
</div>

Based on your markup you can use next or siblings method.

$('a').click(function(event){
   $(this).next('.inner').slideToggle('fast');
   // $(this).siblings('.inner').slideToggle('fast'); 
   event.preventDefault() // prevents the default action of event.       
});

http://jsfiddle.net/Wh5u2/