Creating colorful text in JavaScript

Question

I am trying to write a function that prints a certain text into a <div id="1"> tag.

The string should mark certain index values in different color.

What I have written now is to go to all the index values I have and add a <font color="color"> tag, and then I add it using div1.innerHTML = result;

Its a lot of work, and its very complicated. Is there another way that I can create a string object like I've described without these HTML tags?

If I can do that then I would just use div1.appendChild(String);

Answer 1

I generally am loathe to recommend that anybody use a library that they don't already claim to use, but this is one of those times where the question almost directly asks for a library as an answer :-)

Check out Lettering.JS. It was designed to do exactly what you describe. It wraps your text content by letter or by word or by line (I think) in <span> tags, under your control. You then use CSS to style elements, or some more JavaScript to manipulate and style the elements it creates for you.