Hide/show text

Hi can someone find what's wrong with this code? It's a Q/A page, where all the answers are hidden at first, then an answer is displayed when a question is clicked (after hiding all other displayed answers). It's not working at all.

JS:

Code:

---

<!--Q&A text-->
        <script type="text/javascript">
               
                $(document).ready(function() {
                        $('.answer').hide(); 
                        $('.question').click(function() {
                                var $nextDiv = $(this).next();
                                var $visibleSiblings = $nextDiv.siblings('div:visible');
                       
                                if ($visibleSiblings.length ) {
                                        $visibleSiblings.slideUp('fast', function() {
                                        $nextDiv.slideToggle('fast');
                                });
                                } else {
                                        $nextDiv.slideToggle('fast');
                                }
                        });
                });

        </script>

---

HTML:

Code:

---

<div class="qatext">
        <div class="question">Q: 1</div>
        <div class="answer">A: 1</div>
        <div class="question">Q: 2</div>
        <div class="answer">A: 2</div>
</div>

---

You forgot to specify that only the ".answer" siblings should be hidden after the click. Now questions also gets hidden.

Quote:

---

Originally Posted by Windbrand

Code:

---

<!--Q&A text-->
    <script type="text/javascript">
       
        $(document).ready(function() {
            $('.answer').hide(); 
            $('.question').click(function() {
                var $nextDiv = $(this).next();
                var $visibleSiblings = $nextDiv.siblings('div.answer:visible');
           
                if ($visibleSiblings.length ) {
                    $visibleSiblings.slideUp('fast', function() {
                    $nextDiv.slideToggle('fast');
                });
                } else {
                    $nextDiv.slideToggle('fast');
                }
            });
        });

    </script>

---

---

Thank you I will try that.