Very-Very Simple LetteringJS
HTML
<h2 class="splitWord">Lorem Ipsum</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh <span class="splitWord">euismod tincidunt</span> ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
CSS
body {
padding:50px;
}
.splitWord .char1 {color:red;}
.splitWord .char2 {color:green;}
.splitWord .char3 {color:blue;}
.splitWord .char4 {color:yellow;}
.splitWord .char5 {color:orange;}
.splitWord .char6 {color:yellowgreen;}
.splitWord .char7 {color:cyan;}
.splitWord .char8 {color:gold;}
.splitWord .char9 {color:pink;}
.splitWord .char10 {color:magenta;}
JavaScript
$('.splitWord').children().andSelf().contents().each(function() {
if (this.nodeType == 3) {
var txt = $(this).text().split(' ').join('</span> <span class="char">');
$(this).replaceWith('<span class="char">' + txt + '</span>');
}
});
$('.splitWord').each(function() {
$(this).find('.char').each(function(i) {
$(this).addClass('char' + (i + 1));
});
});