title: JQuery Accordion SubMenu/Nested not working
body: <p>I am using JQuery Accordion and it works as it should and opens and closes fine....BUT I want to add an accordion submenu and this doesn't work nor styles either.</p>
  
  <p>My libraries:</p>
  
  <pre><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"&gt;&lt;/script&gt;
  &lt;link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/start/jquery-ui.css" type="text/css" rel="Stylesheet" /&gt;
  </code></pre>
  
  <p>I added this test:</p>
  
  <pre><code>&lt;p&gt;&lt;a href="#"&gt;TEST MAIN MENU&lt;/a&gt;&lt;/p&gt;
  &lt;div&gt;
  
  &lt;h3&gt;&lt;a href="#"&gt;Sub header&lt;/a&gt;&lt;/h3&gt;
  &lt;div&gt;sub content here&lt;/div&gt;
  
  &lt;/div&gt;
  
  and "Sub header" is not styled as a header nor it wraps up the div below it like "TEST MAIN MENU" does...
  
  On the &lt;head&gt; I have this:
  
  &lt;script&gt;
        $(function() {
              $( "#accordion" ).accordion({
                    active: false,
              autoHeight: false,
              collapsible: true,
              alwaysOpen: false
              });
        });
  
        function collapseAll() {
      $("#accordion")
          .filter(":has(.ui-state-active)")
          .accordion("activate", -1);
      $(".ui-accordion-header").blur();
  }
  
  &lt;/script&gt;
  </code></pre>
  
  <p><code>All I need is to make "&lt;h3&gt;&lt;a href="#"&gt;Sub header&lt;/a&gt;&lt;/h3&gt;"</code> a collapsable div too.</p>