Hi all, I am using JavaScript from a variety of sources (a bookmarklet, a couple of example pages and my own attempted tampering). I am attempting to use this project to better my knowledge of JavaScript and the DOM in general, but also to produce a basic Mozilla Firebird extension at a later date. The first step, however, is making this script work on it's own (within an HTML document).

The object of the script is to highlight all occurances of specific words throughout the content of the page. It is intended to do this in two ways:

1. Grouped (i.e. "testing something")
2. Seperately (i.e. "testing" and "something")

As this is derived from a bookmarklet, I am largely following the methods it has set in place, and attempting to modify them. The script essentially checks through the content and finds all occurances of specific strings, and places a <span> tag around them, setting the background to "yellow".

spannode.style.backgroundColor = "yellow";
The highlight part of the script works (or worked) fine, but I have tried (unsuccessfully) to modify the script so that it removes any existing highlighting before highlighting a new string or sets of strings.

My question/problem is relatively simple (perhaps, compared to the solution):
Is there any way to remove these <span> elements, if any exist, before creating more? If not, how can I adapt them to suit my needs better? (i.e. remove all formatting, and prevent them interfering further with my script). If you check out the test page at the following address:


You will see my rather shoddy attempts at making each <span> have a unique ID, then getting each element by ID and setting it's background colour to "inherit". If you click through the test buttons, you should find that the first and third buttons cease to cause any highlighting after the second and fourth buttons are pressed.

If anyone can help me, or at least guide me in the right direction, it'd be greatly appreciated. I think I'll need to state this explicitly, as I perhaps should have done on other forums: I require this code to work in Mozilla Firebird (well, preferably as cross-platform as possible), so I cannot use any proprietry IE coding.

If there is a more elegant solution than I have attempted to use, please enlighten me. My JavaScript and DOM knowledge is, quite frankly, fairly terrible.

Thanks in advance.