JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content"></div>
<button id="addContent">AddContent</button>
<button id="removeContent">RemoveContent</button>

CSS

#content{
 height: 0px;
}

JavaScript

$("#addContent").click(function () {
  $("#content").append("<div>Some Content <br> Yey ! More Content <br></div>");
   var currentHeight = $("#content").height();
   var autoHeight = $("#content").height("auto").height();
   $("#content").height(currentHeight);
      $("#content").animate({height: autoHeight}, 300);   
});

$("#removeContent").click(function () {
  $("#content").children().first().remove();
   var currentHeight = $("#content").height();
   var autoHeight = $("#content").height("auto").height();
   $("#content").height(currentHeight);
      $("#content").animate({height: autoHeight}, 300);   
});