Skip to main content

Output word by word of paragraph using jQuery

By Sam Deering

JavaScript

Share:

Free JavaScript Book!

Write powerful, clean and maintainable JavaScript.

RRP $11.95

jQuery code snippet which outputs each word in a sentence at a specified interval. You can change the speed at which is outputs by the speed parameter in milliseconds. You can view the demo or load the code in jsfiddle below.

DEMO

jQuery

$(document).ready(function () {
    var $el = $('div'),
        text = $el.text(),
        speed = 1000; //ms

    $el.empty();

    var wordArray = text.split(' '),
        i = 0;

    INV = setInterval(function () {
        if (i >= wordArray.length - 1) {
            clearInterval(INV);
        }
        $el.append(wordArray[i] + ' ');
        i++;
    }, speed);
});

HTML

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi libero aliquam aut commodi illum fuga consequatur labore iste necessitatibus quidem atque aliquid iusto numquam tempora rerum excepturi officiis maiores. Ab?

Load in jsfiddle

Typewriter Plugin

There is a really good typewriter jQuery plugin which acts like a Typewriter which may be of use.

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

New books out now!

Learn valuable skills with a practical introduction to Python programming!


Give yourself more options and write higher quality CSS with CSS Optimization Basics.