JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="spoiler">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni optio provident! Ipsum quibusdam neque amet sapiente quod libero ducimus ipsa possimus totam voluptatem nemo ex expedita sequi voluptatum rerum corrupti.</p>
    </div>
    <button class="show-hide">Показать</button>
</div>

CSS

.spoiler {
    width: 30%;
    overflow: hidden;
}

JavaScript

var halfText = $('.spoiler').innerHeight() / 2,
    textHeight = $('.spoiler').innerHeight();

$('.spoiler').css('height', $('.spoiler').innerHeight() / 2);

$('.show-hide').click(function() {
    if( $('.spoiler').innerHeight() == halfText ) {
        $('.spoiler').animate({ height: textHeight }, 500);
        $(this).text('Скрыть');
    } else {
        $('.spoiler').animate({ height: halfText }, 500);
        $(this).text('Показать');
    }
});