JSFiddle - React, Tailwind, and code Playground

HTML

<div contenteditable="true">
<p class="wtf">
    WHAT IS HAPPENING asdfkjas dflkasd jfalskdfj asldkfj asldkf
</p>
    <p class="wtf">
    SECOND LINE and it also needs to have an ellipsis
</p>
</div>

CSS

.wtf{
    width:250px;
    overflow-x: hidden;
    white-space:nowrap;
    text-overflow: ellipsis;   
    margin: 0;
    padding:0;
}

JavaScript

$('body').html('');