JSFiddle - React, Tailwind, and code Playground

by mmansion

HTML

<h1>Ellipsis Formating Test</h1>
<hr>
<h1>Movie Titles</h1>

<p>BridesMaids:MKG HD</p>
<p>La Otra Familia HD</p>
<p>127 hours</p>

<hr>

<h1>Output</h1>

<div id="title_0" class="title"></div>
<div id="title_1" class="title"></div>
<div id="title_2" class="title"></div>

JavaScript

function ellip(str, maxLength) {
    console.log(str);
    
    var ellip = "\u2026";
    if (str.length > maxLength) {
        return str.substr(0, (maxLength - 1)) + ellip;
    } else {
        return str;
    }
    
}
    
     
var titles = document.getElementsByTagName("p");

for (var i = 0; i < titles.length; ++i) {

    var title = ellip(titles[i].innerHTML, 12);
    document.getElementById("title_" + i).innerHTML = title;
}