Onclick only works once?

New first post:
Hey everyone,

I’ve come this far with making a nice spoiler field. However I’m trying to add more to it, which might not be possible. Is there any way to modify the way selected text is displayed? And I mean especially the colour and background?
Point is, I want the text and background colour be the same as the background colour when selected.

My current field is here: http://194.109.217.194/Mark/Design/spoiler/.
And this is the code I’m using for it:


<div style="border: 1px solid #000000; margin: 0px; padding: 2px; background-color: #EEEEEE; color: #EEEEEE;" onclick="if(this.style.color == 'rgb(0, 0, 0)' || this.style.color == '#000000'){this.style.color = '#EEEEEE'; }else{ this.style.color = '#000000';}">
{TEXT}
</div> 

[FONT=monospace]

[/FONT] Old post:
Hey everyone,

my newest challenge is to make a small field on a website, which can only be seen by clicking on it, and can be hidden again, by clicking again. I’m currently using this piece of code:

<div style="margin: 0px; padding: 2px; border: 1px solid #000000; background-color: #EEEEEE; color: #EEEEEE" onclick="if (this.style.color != '#000000') { this.style.color = '#000000'; } else { this.style.color = '#EEEEEE'; }">
{TEXT}
</div>

Clicking once works, clicking a second time to hide it does not work. Why is this?

Link: http://194.109.217.194/Mark/Design/spoiler/

Perhaps you should try using innerHTML to set the text to “” when it is toggled off, and then rewrite it (again with innerHTML when it is toggled on. That way it is not invisible but selectable, it is just gone.