Highlight words

shajimanjeri

Apr 23rd 2007, 7:26 am

Hey,

I need to highlight some bad words in my div tag. How to highlight these words.
For example
Suppose this is my div tag with id 'newDiv'
The content inside this div tag is
"
This world is filled with problems, It is becouse of ignorance.
"
Here I need to highlight these words "is, filled, ignorance",
please give me a solution.

with regards
Shaji :)

ajsa52

Apr 23rd 2007, 9:07 am

You can use regular expressions and replace function. Example:

<html>
<head>

<style type="text/css" media="screen">

.ch { background-color:yellow; }

</style>

<script type="text/javascript">

function change()
{
var l_oldData = document.getElementById( "newDiv" ).innerHTML;
var l_poner = '$1<span class="ch">$2</span>$3';
var l_newData = l_oldData.replace( /(.*)(is)(.*)/gi, l_poner );
l_oldData = l_newData.replace( /(.*)(filled)(.*)/gi, l_poner );
l_newData = l_oldData.replace( /(.*)(ignorance)(.*)/gi, l_poner );
// alert( "l_newData='" + l_newData + "'" );
document.getElementById( "newDiv" ).innerHTML = l_newData;
}

</script>

</head>
<body onLoad="change();">
<div id="oldDiv"> 
This world is filled with problems, It is becouse of ignorance.
</div>
<div id="newDiv"> 
This world is filled with problems, It is becouse of ignorance.
</div>
</body>
</html>