JSFiddle - React, Tailwind, and code Playground

HTML

<button id="addButton">Add</button>
<div id="test">
<div class='inner'></div>
</div>

CSS

.inner {
    height : 50px;
    -moz-transition: all 0.3s ease 0.1s;
    -webkit-transition: all 0.3s ease 0.1s;
    transition: all 0.3s ease 0.1s;
    background : #ded;
    border : 1px solid #999;
}

.inner.start-animation {
    height : 0px;
}

JavaScript

var $testTable = $("#test"),
    $itemBeingAdded;

$("#addButton").click(function () {
    $itemBeingAdded = $("<div class='inner start-animation'></div>");    
    $testTable.append($itemBeingAdded);
    setTimeout(function () {
        $itemBeingAdded.removeClass("start-animation");
    }, 100);
});