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/

Reply via email to