JSFiddle - React, Tailwind, and code Playground

by yash009

HTML

<li class="children level1">
    <a href="https://dev.holmescustom.com/signage/office-signage">
        <span>Office Signs</span>
    </a>
    <ul class="level1" style="display: block;">
        <li class="level2">
            <a href="https://dev.holmescustom.com/signage/office-signage/wash-hands-hygiene">
                <span>Wash Hands and Hygiene</span>
            </a>
        </li>
        <li class="level2">
            <a href="https://dev.holmescustom.com/signage/office-signage/entrance-and-exit">
                <span>Entrance &amp; Exit Signage</span>
            </a>
        </li>
        <li class="level2">
            <a href="https://dev.holmescustom.com/signage/office-signage/way-finding">
                <span>Way-finding Signage</span>
            </a>
        </li>
    </ul>
</li>
<li class="children level1">
    <a href="https://dev.holmescustom.com/signage/shop-by-template">
        <span>Shop by Template</span>
    </a>
    <ul class="level1" style="display: block;">
        <li class="level2">
            <a href="https://dev.holmescustom.com/signage/shop-by-template/smoking-no-vaping-signs">
                <span>Smoking &amp; Vaping</span>
            </a>
        </li>
        <li class="level2">
            <a href="https://dev.holmescustom.com/signage/shop-by-template/parking-signs">
                <span>Parking</span>
            </a>
        </li>
        <li class="level2">
            <a href="https://dev.holmescustom.com/signage/shop-by-template/store-hours">
                <span>Store Hours</span>
            </a>
        </li>
        <li class="level2">
            <a href="https://dev.holmescustom.com/signage/shop-by-template/restrooms-signs">
                <span>Restrooms</span>
            </a>
        </li>
    </ul>
</li>

JavaScript

jQuery('li.children.level1').each(function () {
			if (jQuery(this).find('ul').length) {
				jQuery(this).append('<a href="#" class="subCat">Sub-Categories</a>');
			}
		});
		jQuery('.subCat').click(function () {
			jQuery(this).prev('ul:first.level1').slideToggle();
		});