Does Jquery UI Accordion requires a div after each h tag?

Question

Here is my original code:

 <div id="accordion">
    <h1>Header #1</h1>
    <div>
        <ul>
            <li><a href="#">List item #1</a></li>
        </ul>
    </div>

    <h1>Header #2</h1>
    <div>
        <ul>
            <li><a href="#">List item #1</a></li>
            <li><a href="#">List item #2</a></li>
            <li><a href="#">List item #3</a></li>
            <li><a href="#">List item #4</a></li>
        </ul>
    </div>
</div>

I tried to remove the inner div tags, and the code worked just fine. The only difference is that when I surround the ul tags with div tags, it creates some margin around them.

Every documentation or tutorial I came across about Jquery UI Accordion, uses div tags after the h tags, but since it is working also without them, I ask my self if they are required.

Thank you very much. :)

Answer 1

Just scanned the jQuery UI github source, the accordion seem to work on the class ui-accordion-content - so it should be OK - as long as you use a block element (p / div / ul etc).

https://github.com/jquery/jquery-ui/search?utf8=✓&q=ui-accordion-content