JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div class="top">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,It has survived not only five centuries, It has survived not only five centuries,It has survived not only five centuries  
    </div>
    <div class="bottom">Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock,t has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock 
    </div>
</div>
<div id="overflow"></div>
<div id="output">
    <h4>Overflowing text:</h4>
    <div id="textOverflowing"></div>
</div>

CSS

#container,
#overflow
{
    height:200px;
    width:300px;
    border:5px solid #000;
    position:relative;
}
.top
{
    background:red;
    min-height:100px;
    width:300px; 
}
.bottom
{
    background:rgba(0,0,255,0.5);
    width:300px;
}
#overflow{
    overflow:auto;
    position:fixed;
    top:-9999px;
    right:-9999px;
    width:300px; /* updates in JS to accommodate scrollbar width */
}
    #overflow > div{
        width:300px;
    }
.scrollbar-measure {
	width: 100px;
	height: 100px;
	overflow: scroll;
	position: absolute;
	top: -9999px;
}


#output{
    position:absolute;
    top:0;
    right:0;
    width:300px;
}
#textOverflowing{
    color:red;
}

JavaScript

// thanks to http://davidwalsh.name/detect-scrollbar-width
var scrollDiv = document.createElement("div");
scrollDiv.className = "scrollbar-measure";
document.body.appendChild(scrollDiv);
// Get the scrollbar width
var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
// Delete the DIV 
document.body.removeChild(scrollDiv);


var overflowText = '';
var inner = $('#container').html();
$('#overflow').css('width',(300+scrollbarWidth)+'px').html(inner);


for(x=0;x < $('#container').find('.bottom').text().length; x++){
    if(checkOverflow($('#overflow').get(0))){
        var text = $('#overflow').find('.bottom').text();
        // find index of last " "
        var lastIndex = text.lastIndexOf(" ");
        overflowText = text.slice(lastIndex - text.length) + overflowText;
        $('#overflow').find('.bottom').text(text.substring(0, lastIndex));
    }else{
        // RATHER THAN OUTPUT THIS INFORMATION TO A VISIBLE ELEMENT HERE
        // YOU COULD SAVE THIS 'overflowText' VARIABLE WHERE EVER YOU LIKE
        $('#textOverflowing').text(overflowText); 
        break;
    }
}

// thanks to http://stackoverflow.com/a/143889/648350
function checkOverflow(el)
{
   var isOverflowing = el.clientHeight < el.scrollHeight;
   return isOverflowing;
}