You use
createTextNode
which creates just a
text node, no HTML element.
It looks like you want to replace the old HTML of an element with the new HTML containing the colored words. I cannot see how you access the elements from your JavaScript, but what you can do is basically this:
var element = ...;
var originalHtml = element.innerHTML;
var newHtml = originalHtml.replace(_word, _word.fontcolor("red"));
element.innerHTML = newHtml;
Note that .replace only replaces the first occurrence of the word. If you want to replace all occurrences, you can use a regular expression:
var newHtml = originalHtml.replace(new RegExp(_word, "g"), _word.fontcolor("red"));
Also note that setting the
innerHTML
property causes the element to lose all event handlers. So if you have event handlers bound to your "li"-elements, then I recommend to not put your text immediately in the li-tag, but in another tag in the li tag, like this:
<li><span>your text here</span></li>
.