JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<p style="width: 500px; height: 20px; overflow: hidden;" id="myParagraph">
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Blanditiis amet sunt laudantium officia
sed porro dolorem odit iusto quidem enim ab nihil, quos quod ad quam atque veritatis iure architecto?
</p>
<button id="btnSeeMore">See More</button>
<script>
var seeMore = true;
var myParagraph = document.getElementById('myParagraph');
var myBtn = document.getElementById('btnSeeMore');
myBtn.addEventListener('click',function(e){
console.log("event",e);
if(seeMore){
console.log("if");
myParagraph.style.overflow = "none";
myParagraph.style.height = "100px";
myBtn.innerHTML = "See Less";
seeMore = false;
}else{
console.log("else");
myParagraph.style.overflow = "hidden";
myParagraph.style.height = "20px";
myBtn.innerHTML = "See More";
seeMore = true;
}
});
</script>
</body>