CODEWITHSUNDEEP
jqueryclicktoggleslide
eozzy
eozzy

Reputation: 68650

Toggle next element (jQuery)

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();
    });
}

... I can't figure out why it isn't working.

Upvotes: 2

Views: 19184

Answers (3)

Jack Barham
Jack Barham

Reputation: 3209

Heres a simple version...

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

Upvotes: 1

Kobi
Kobi

Reputation: 138007

Mind the dot:

.interview

Also, there is no slideIn, try slideDown and slideUp: http://jsbin.com/ajawo3

If you don't have any other code in these functions, a better choice is slideToggle: http://api.jquery.com/slideToggle/

Upvotes: 6

rahul
rahul

Reputation: 187030

You are using a class selector and it should begin with a .

So you have to change 

$('interview .question')

to

$('div.interview .question')

Upvotes: 1

Related Questions