Question

I am trying to make a slide toggle query. I have below list, and want the functioning same like Accordion (if I click on a li, that li slides down and other slides up).

$(document).ready(function(){
    $(".da_faq_list li h3").click(function(){
        $(this).parent().find(".da_faq_content").slideToggle("slow");
    });
});

<ul class="da_faq_list">
    <li>
        <h3>Head 1</h3>
        <div class="da_faq_content">
            Content Here
        </div>
    </li>
    <li>
        <h3>Head 1</h3>
        <div class="da_faq_content">
            Content Here
        </div>
    </li>
    <li>
        <h3>Head 1</h3>
        <div class="da_faq_content">
            Content Here
        </div>
    </li>
    <li>
        <h3>Head 1</h3>
        <div class="da_faq_content">
            Content Here
        </div>
    </li>
</ul>

Answer 1

In the absence of the accordion plugin, here’s a quick way of accomplishing this:

http://jsfiddle.net/bryanjamesross/b8YAa/

The point is to slide up any element that is visible using the :visible selector, and then slide down the content div that is contained in the same LI as the H3 that was clicked.