Jqueryui Accordion: Crear acordeones dentro de otros acordeones (nested accordion)

<div class="accordion">
        <h3>1</h3>
        <div>
            <div class="accordion">
                 <h3>1.1</h3>
                 <div>
                    <p>En un lugar de la Mancha de cuyo nombre no quiero acordarme no hace mucho que vivía un hidalgo de cuyo nombre tampoco me acuerdo.</p>
                </div>
            </div>
        </div>
    </div>
   
    <div class="accordion">
        <h3>2</h3>
        <div>
            <div class="accordion">
                 <h3>2.1</h3>
                 <div>
                    <p>En un lugar de la Mancha de cuyo nombre no quiero acordarme no hace mucho que vivía un hidalgo de cuyo nombre tampoco me acuerdo.</p>
                </div>
            </div>
            <div class="accordion">
                 <h3>2.2</h3>
                 <div>
                    <p>En un lugar de la Mancha de cuyo nombre no quiero acordarme no hace mucho que vivía un hidalgo de cuyo nombre tampoco me acuerdo.</p>
                </div>
            </div>
        </div>
    </div>

<script>
$(function () {
    $(".accordion").accordion({
        collapsible: true,
        active: false,
        heightStyle:"content"
    });
    var icons = $(".accordion").accordion("option", "icons");
 
    $('.ui-accordion-header').click(function () {
        $('.open').removeAttr("disabled");
        $('.close').removeAttr("disabled");

    });
});
</script>