JSFiddle - React, Tailwind, and code Playground

by dannyj6

HTML

<button id="lq_button">Toggle Class</button>
<div id="lq_textbox1" class="lq_textbox lq_class1">
  <p>Small amount of text of text</p>
  <p>Loads of text</p>
  <p>Loads of text</p>
  <p>Loads of text</p>
  <p>Loads of text</p>
  <p>Loads of text</p>
  <p>Loads of text</p>
  <p>Loads of text</p>
  <p>Loads of text</p>
</div>

CSS

.lq_textbox {
  overflow:hidden;
  border: 1px solid #900;
  padding:10px;
}
.lq_class1 {
  height:44px;
}
.lq_class2 {
  height:500px;
}

JavaScript

jQuery('#lq_button').click(function() {
    jQuery('#lq_textbox1').toggleClass("lq_class1 lq_class2"); 
});