title: jQuery UI Accordion ALL tabs active on page load
body: <p>I have nested accordions made with jQuery UI.</p>
  
  <pre><code>&lt;div id="accordion"&gt;
      &lt;h3&gt;Location 1 (main, NEW YORK, NY 10292)&lt;/h3&gt;
          &lt;div id="accordion-2"&gt;
              &lt;h3&gt;Class Code Information&lt;/h3&gt;
              &lt;div&gt;
              &lt;span class="block-1"&gt;
              &lt;span class="block-2"&gt;
              &lt;span class="block-3"&gt;
  ...      
  </code></pre>
  
  <p>By default making <code>active:true</code> I'm getting 1st main and 1st (block-1) child opened.
  How can I make all children of 1st main accordion active(opened):
      block-1
      block-2
      block-3
      ...</p>
  
  <p>this is my JS</p>
  
  <pre><code>$(function() {
  var icons = {
          header: "iconClosed", // custom icon class
          activeHeader: "iconOpen" // custom icon class
      };
      $("#accordion, #accordion-2").accordion({
          autoHeight: false,
          collapsible: true,
          heightStyle: "content",
          icons: icons
      });
  });
  </code></pre>
  
  <p>Anyone know how to achieve this?</p>