JSFiddle - React, Tailwind, and code Playground

HTML

<div id="sample">
    <h1>Hello World main headinh</h1>
    <h2>Hello World sub heading</h2>
    <p>Hello world paragraph</p>
    <p>Hello world paragraph</p>
    <p>Hello world paragraph</p>
    <p>Hello world paragraph</p>
</div>

CSS

#sample{
    height: 0px;
    overflow: hidden;
    transition-duration: 1.2s;
}

JavaScript

var element = document.getElementById('sample');
element.style.height= element.scrollHeight+"px"