Question

I know from reading the documentation that the active option in accordion take a boolean value or an integer. Is there a way to do this based off a selector?

What I am trying to accomplish is if an element has the class active make the parent section active via accordion. I am targeting the h3 element. In the code I included the First section should be active due to the class active on the li with value 1.

Jquery

var t = $('.ui-accordion-content a.active');
if (t.length){
   //select the h3 element
   var parent = $(t).parents('h3.ui-accordion-header');
   //close all sections 
   $( ".accordion" ).accordion( "option", "active", false );
   //open section 
   $( ".accordion" ).accordion( "option", "active", parent );
}

Html

<div>
<ul>
    <li>0</li>
</ul>
<ul class="accordion">
        <li>
            <h3><a href="#">First</a></h3>
            <div>
                <ul>
                    <li class="active">1</li>
                    <li>2</li>
                </ul>
            </div>
        </li>
        <li>
            <h3><a href="#">Second</a></h3>
            <div>
                <ul>
                    <li>3</li>
                    <li>4</li>
                </ul>
            </div>
        </li>
</ul>

Answer 1

I added an attribute to the h3s

<h3 accordian-index="0"><a href="#">First</a></h3>

then I select the attr and use the integer to set the active

var headerIndex = parseInt($(t).parents('.ui-accordion-content').siblings('h3').attr('accordian-index'));
$( ".accordion" ).accordion( "option", "active", headerIndex);

its not the solution I deserve, but its the one I needed right now.