JSFiddle - React, Tailwind, and code Playground

by gabrieleromanato

HTML

<p><button id="run">Create excerpt</button></p>

<p id="test">Rhoncus mid, ac! Risus magnis ut ac pid. Elementum montes massa amet. Platea tristique! Facilisis, et ut mauris, ut ac! Hac. Porta purus lorem, ridiculus est montes, dictumst, turpis mattis lorem! Porta diam! Et ac urna sed aliquam parturient tempor, a hac! Dapibus sociis! Placerat integer, ac vut! Nunc lundium vut scelerisque egestas odio tincidunt. Ridiculus pellentesque integer rhoncus nec vut cursus integer dictumst, magnis proin vut pellentesque! Nec lorem augue vut magna enim lundium facilisis, nisi et! Nisi magnis? Tincidunt? Magnis penatibus etiam odio urna sed? Lectus tincidunt dignissim, lectus porta! Etiam sit sociis amet, ut porta platea, et placerat mus! Rhoncus! Aliquet? Nascetur dictumst a velit nisi non habitasse nisi! Massa, magna, parturient amet ac non montes augue.</p>

JavaScript

(function($) {

    $.fn.the_excerpt = function(options) {

        var that = this;

        options = $.extend({
            length: 160,
            ellipsis: '...'
        }, options);

        var theExcerpt = function(str, length) {

            var newStr = str;
            var words = str.split('', length + 1);

            if (words.length > length) {
                words.pop();
                words.push(options.ellipsis);
                newStr = words.join('');
            }

            return newStr;
        };

        return that.each(function() {

            var text = $(that).text();
            var excerpt = theExcerpt(text, options.length);

            $(that).text(excerpt);

        });


    }



})(jQuery);


$('#run').click(function() {

    $('#test').the_excerpt();
});