JSFiddle - React, Tailwind, and code Playground

by Amit Choudhary

HTML

<div id="upButton">&nbsp;</div>
<div id="container" style="overflow: hidden;height: 40px;">
<div id="divWithExcessiveContent" >
    content number 1<br/>
    content number 2<br/>
    content number 3<br/>
    content number 4<br/>
    content number 5<br/>
    ...
    content number 100<br/>
</div>
</div>
<br>
<div id="downButton" style="border:solid 1px;width:50px;">Button</div>

JavaScript

var i = 40;

$('div#downButton').click( function() {
    i = i + 20;
   $('div#container').css('height', i + 'px');
  });