JSFiddle - React, Tailwind, and code Playground

by mohammadAdil

HTML

<div class="expander" id="edu">educational qualifications
    <ul class="list">
        <li>bachelor's in cs</li>
        <li>
            <div class="expander">master's in machine learning
                <ul class="list" id="edu1">
                    <li>authored the famous paper on giving a shit</li>
                    <li>co-authored several other papers</li>
                </ul>
            </div>
        </li>
        <li>
            <div class="expander">phd in visual intelligence
                <ul class="list">
                    <li>watch and learn</li>
                    <li>haha.</li>
                </ul>
            </div>
        </li>
        <li>cleared jee mains</li>
        <li>cleared cbse aissce</li>
    </ul>
</div>

JavaScript

$(document).ready(function () {
    $('.expander ul').hide();
    $('.expander').mouseenter(function () {
        $('ul:first',this).fadeIn('fast');
    });
});