Basculer élément suivant (jQuery)

Question

HTML:

<div class="interview"> 
    <h4>Interview</h4> 
    <a href="#" class="question">This is question 1?</a> 
    <div class="answer">This is an answer!</div> 
    <a href="#" class="question">This is question 2?</a> 
    <div class="answer">This is an answer!</div> 
    <a href="#" class="question">This is question 3?</a> 
    <div class="answer">This is an answer!</div> 
</div> 

jQuery:

if ($('interview')[0]) { 
    $('interview .question').toggle(function() { 
     $(this).next('.answer').slideIn(); 
    }, 
    function() { 
     $(this).next('.answer').slideOut(); 
    }); 
} 

... Je ne peux pas comprendre pourquoi il ne fonctionne pas.

Answer 1

Mind the dot:

.interview 

En outre, il n'y a pas slideIn, essayez slideDown et slideUp: http://jsbin.com/ajawo3

Si vous n'avez pas d'autre code dans ces fonctions, un meilleur choix est slideToggle:

Answer 2

Vous utilisez un sélecteur de classe et il doit commencer par .

donc vous devez changer

$('interview .question') 

à

$('div.interview .question') 

Answer 3

Heres une version simple ...

$('a.question').click(function() {  
    $(this).next('.answer').slideToggle(); 
});