JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js"></script>
<div class="more-text">
  Много текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного
  текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного текстаМного
  текстаМного текста
</div>
<a href="#" class="url-more-text"><span class="open">Подробнее</span><span class="minim">Свернуть</span></a>

CSS

.more-text {
  max-height: 1.25rem;
  overflow: hidden;
  transition: max-height .2s ease-out;
}

.more-text.open {
  max-height: 100px;
  transition: max-height .2s ease-out;
}

.url-more-text {
  float: right;
}

.more-text.open + .url-more-text .minim,
.more-text + .url-more-text .open {
  display: inline-block
}

.more-text.open + .url-more-text .open,
.more-text + .url-more-text .minim {
  display: none
}

JavaScript

$('.url-more-text').click(function() {
  $(this).siblings(".more-text").toggleClass("open");
});