JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content">
    Some Lorem ipsum<span id="overflow"> and some more lorem 
    and more and more and more and more and more and more and more and more  
    more and more and more and more and more and more and more and more and  
    </span><a href="#top" class="moreorless"> more...</a> 
</div>

CSS

body{ width:50%; margin: 0 auto;}
.content{background:yellow; font-size:large; margin-top:10px; 
    padding:5px;}
a{text-decoration:none;}

JavaScript

$("#overflow").hide();

$(".moreorless").click(function() {
    event.preventDefault();
    $(this).next("#overflow").slideToggle();
    
    if($(this).prev("#overflow").is(":hidden")){
        $(this).prev("#overflow").show();
        $(this).html(" less...");
    }
    else{
        $(this).prev("#overflow").hide();
        $(this).html(" more...");
    }       
});