JSFiddle - React, Tailwind, and code Playground

HTML

<div class="mainBlock">
        <h1>ExanpleMenu</h1>
        <div class="wrapper_block">
 
            <div class="block1">
                <h2>Item1</h2>
                <ul class="content">
                    <li class="item">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. A autem amet ratione iure, sed voluptate!
                    </li>
                    <li class="item">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. A autem amet ratione iure, sed voluptate!
                    </li>
                    <li class="item">
                        Lorem ipsum dolor sit amet, consectetur
                    </li>
                    <li class="item">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. A autem amet ratione iure, sed voluptate! Lorem ipsum dolor sit amet, consectetur adipisicing elit. A autem amet ratione iure, sed voluptate!
                    </li>
                    <li class="item">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. A autem amet ratione iure, sed voluptate! Lorem ipsum dolor sit amet, consectetur adipisicing elit. A autem amet ratione iure, sed voluptate! Lorem ipsum dolor sit amet, consectetur adipisicing
                        elit. A autem amet ratione iure, sed voluptate!
                    </li>
                    <li class="item">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit
                    </li>
                </ul>
                <button type="button" class="btn_showMore">Show more</button>
            </div>
 
            <div class="block2">
                <h2>Item2</h2>
                <ul class="content">
                    <li class="item">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. A autem amet ratione iure, sed voluptate!
                    </li>
                    <li class="item">
        ...

CSS

.mainBlock {
        width: 100%;
    }
 
    h1 {
        font-size: 20px;
    }
 
    .wrapper_block {
        position: relative;
        width: 100%;
        border: 1px solid #000;
    }
 
    .content {
        position: relative;
        width: 80%;
 
        height: 120px;
        min-height: 120px;
 
        overflow: hidden;
        list-style-type: none;
        border: 1px solid #f00;
    }
 
    .content_active {
        height: auto !important;
    }
 
    .item {
        width: 100%;
        margin: 5px 0;
        border: 1px solid #333;
    }
 
    .item:nth-child(odd) {
        background-color: #ff0;
    }
 
    .btn_showMore {
        width: 200px;
        height: 40px;
        margin: 10px auto;
        background-color: #00f;
        color: #fff;
        text-transform: uppercase;
        cursor: pointer;
    }

JavaScript

$(".content").each(function(i,el){
          var innerHeight =  $(el).children().scrollHeight;
          alert(innerHeight + " = innerHeight");
      });