This should work:
$(".question").click(function(){
$(".answer").hide(); // hide all answers
$(this).next().show(); // show only the answer
following the question
clicked
});
...as long as the answer immediately follows the question, as per your
example.
This uses the jQuery hide() and show() methods; you could add/remove
hide/show CSS classes as well.
________
SEAN O
badtant wrote:
>
> sounds goog but i can't get it to work... i can only get "toggle all
> answers" to work. i want to be able to toggle each specific question.
>
> i think this should work, but nothing happends:
>
> $("p.question").click(function() {
> $(this).parent("p.answer").toggleClass("show");
> });
>
> /n
>
>
>
>
> Dan Atkinson wrote:
>>
>> How bout doing $().toggle?
>>
>> Also,
>>
>> $("p").addClass("classname"); -- that will add a class.
>>
>>
>> badtant wrote:
>>>
>>> hi! i have the following list:
>>>
>>> <ul>
>>> <li>
>>> <h2>Kapitalförsäkring</h2>
>>> <p class="question">- q</p>
>>> <p class="answer">a</p>
>>> </li>
>>>
>>> <li>
>>> <h2>Kapitalpension</h2>
>>> <p class="question">- q</p>
>>> <p class="answer">a</p>
>>> </li>
>>> </ul>
>>>
>>> the class answer has the css "display:none". what i want to do with it
>>> is that when someone clicks a question the answer should be shown and
>>> all other answers should be hidden. to show an answer i have the class
>>> "show".
>>> i know how to remove the class from all answers with
>>> $("p.answer").removeClass("show"); but i don't know how to add the class
>>> again for the right answer. any idéas on this?
>>>
>>> thanks!
>>> /niklas
>>>
>>
>>
>
>
--
View this message in context:
http://www.nabble.com/expand-one---collapse-the-others-tf2493260.html#a6959713
Sent from the JQuery mailing list archive at Nabble.com.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/