JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.20/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.8.20/jquery-ui.js"></script>
<div class="main">
    <h3><a href="#">1</a></h3>

    <div>
        <div class="main">
            <h3><a href="#">1.1</a></h3>

            <div>Content</div>
            <h3><a href="#">1.2</a></h3>

            <div>Content</div>
            <h3><a href="#">1.3</a></h3>

            <div>Content</div>
        </div>
    </div>
    <h3><a href="#">2</a></h3>

    <div>
        <div class="main">
            <h3><a href="#">2.1</a></h3>

            <div>Content</div>
            <h3><a href="#">2.2</a></h3>

            <div>Content</div>
            <h3><a href="#">2.3</a></h3>

            <div>Content</div>
        </div>
    </div>
    <h3><a href="#">3</a></h3>

    <div>
        <div class="main">
            <h3><a href="#">3.1</a></h3>

            <div>Content</div>
            <h3><a href="#">3.2</a></h3>

            <div>Content</div>
            <h3><a href="#">3.3</a></h3>

            <div>Content</div>
        </div>
    </div>

</div>

JavaScript

$( ".main" ).accordion();