JSFiddle - React, Tailwind, and code Playground

HTML

<div id="menu">
    <ul id="list">
        <!-- Create a bunch, or not a bunch, of li's to see the timing. -->
        <li>item</li>
        <li>item</li>
    </ul>
</div>

CSS

#menu #list {
    max-height: 300px;
    transition: max-height 0.15s ease-out;
    background: #d5d5d5;
}

JavaScript

setInterval(function() {
    var li = document.createElement("li");
    li.innerHTML = "item";
    document.getElementById("list").appendChild(li);
}, 1000);