Close accordions if other accordian is open in jquery
<p>I have multiple jquery accordions on one page all with different id's etc.. I'm attempting to only allow one accordion to open at a time. For example the user opens one and then goes on to  a different accordion and the new one opens as the one that user was just using closes.</p>

<p>is there anyway of doing this?</p>

<p>Below is an example of one accordion.... they all look the same at the moment.</p>

<pre><code>&lt;div id="accordion"&gt;


&lt;h3 class="one" href="#section1"&gt;Location&lt;/a&gt;&lt;/h3&gt;
&lt;div class="tab1"&gt;

    &lt;form class="myform"&gt;
    &lt;label&gt;&lt;b&gt;Weeks&lt;/b&gt;&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "allweeks" /&gt; &lt;label for = "allweeks"&gt;All Weeks&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w1" /&gt; &lt;label for = "w1"&gt;Week 1&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w2" /&gt; &lt;label for = "w2"&gt;Week 2&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w3"  /&gt; &lt;label for = "w3"&gt;Week 3&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w4" /&gt; &lt;label for = "w4"&gt;Week 4&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w5" /&gt; &lt;label for = "w5"&gt;Week 5&lt;/label&gt;&lt;/br&gt;
        &lt;input type = "checkbox" id = "w6"  /&gt; &lt;label for = "w6"&gt;Week 6&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w7" /&gt; &lt;label for = "w7"&gt;Week 7&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w8" /&gt; &lt;label for = "w8"&gt;Week 8&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w9" /&gt; &lt;label for = "w9"&gt;Week 9&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w10"  /&gt; &lt;label for = "w10"&gt;Week 10&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w11"  /&gt; &lt;label for = "w11"&gt;Week 11&lt;/label&gt;&lt;br&gt;
        &lt;input type = "checkbox" id = "w12"  /&gt; &lt;label for = "w12"&gt;Week 12&lt;/label&gt;&lt;br&gt;


     &lt;/form&gt;

&lt;/div&gt;
</code></pre>

<p>These are the scripts i'm using at the moment</p>

<pre><code>    &lt;script&gt;


$(function() {
    $( "#accordion,#accordion1,#accordion2,#accordion3,#accordion4,#accordion5" ).accordion();


});


$(function() {
    var icons = {
        header: "ui-icon-circle-arrow-e",
        headerSelected: "ui-icon-circle-arrow-s"
    };
    $( "#accordion,#accordion1,#accordion2,#accordion3,#accordion4,#accordion5" ).accordion({
        icons: icons,
        collapsible: true
    });
    $( "#toggle" ).button().toggle(function () {
        $( "#accordion,#accordion1,#accordion2,#accordion3,#accordion4,#accordion5" ).accordion( "option", "icons", false );
    }, function () {
        $( "#accordion,#accordion1,#accordion2,#accordion3,#accordion4,#accordion5" ).accordion( "option", "icons", icons );
    });
});


$(function() {
$("#accordion,#accordion1,#accordion2,#accordion3,#accordion4,#accordion5").accordion({ header: "h3", collapsible: true, active: false }); });

&lt;/script&gt;
</code></pre>

<p></p>
