javascript - Select every word and give it another color -

javascript - Select every word and give it another color -

how can select every word in page, reverse , give color?

what tried now:

jquery('*').each(function(){ var text = jquery(this).text().split(' '), len = text.length, result = []; for( var = 0; < len; i++ ) { result[i] = '<span style="color: green;">' + text[i].split("").reverse().join("") + '</span>'; } jquery(this).html(result.join(' ')); });

but pretty far need. clues?

you trying replace entire contents of elements, has problem when seek replace root nodes

//the main point here need replace contents of text node, not html parts jquery('*').contents().each(function () { //not text node or there no content replace if (this.nodetype != 3 || !this.nodevalue.trim()) { return; } //replace value of text node $(this).replacewith(this.nodevalue.replace(/\w+/g, function (part) { homecoming '<span style="color: green;">' + part.split("").reverse().join("") + '</span>' })) });

demo: fiddle

javascript jquery html css