JSFiddle - React, Tailwind, and code Playground

by kpoxo6op

HTML

<div id="p-list">
    <ul>
        <li><a href="#" class="cat">category 1</a>
            
            <ul>
                <li>sub link</li>
                <li><a href="#" class="cat">sub category 1</a>
                    <ul>
                        <li>sub link</li>
                        <li>sub link</li>
                        <li>sub link</li>
                    </ul>
                </li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
            </ul>
            
        </li>
        <li><a href="#">Not a category</a></li>
        <li><a href="#" class="cat">category 2</a>
            <ul>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
                <li>sub link</li>
    ...

JavaScript

jQuery(document).ready(function($) {
    $("#p-list a.cat").next().hide();
    $("#p-list a.cat").click(function() {
        $(this).next().slideToggle();
    });
})