JSFiddle - React, Tailwind, and code Playground

HTML

<p class="wrapped">Short paragraph with no ellipsis.</p>
<p class="wrapped">This is my long paragraph that uses text-overflow. The quick brown fox jumps over the lazy dog.</p>
<p class="wrapped box">As shown, ellipsis will not kick in unless a box is imposed.</p>

CSS

.box {
    overflow: hidden;
    white-space: nowrap;
}

JavaScript

$(".wrapped").each(
    function() {
        if ($(this).text().length > 50)
        {
            $(this).css("text-overflow", "ellipsis");
            $(this).css("background-color", "#FF8888");
        }
    }
    );