Get mouse hover effect work on tables create by twiki

[lcpx]

Hi guys,

I am having a problem of getting mouseover event work on a webpage which is pre-populated by a third party tool twiki. The html code is something like this:

<table cellspacing="0" id="table1" cellpadding="0" class="twikiTable" rules="rows" border="1"> 
		<tr class="twikiTableOdd twikiTableRowdataBgSorted0 twikiTableRowdataBg0"> 

On the condition of knowing what the table name (always going to be table1) will be, can I write some javascripts to make the mouse hover effect work.

Here is the code I use but I can't get it work somehow.

CSS

<!-- highlight --> <style type="text/css"> 
tr:hover, tr.highlight { background-color: #aaa; } 
</style> 

function setupHighlight() {
    var rows = document.getElementsByTagName('tr');
    alert("rows is: " + rows);
	for (i = 0; i < rows.length; i++) {
        rows[i].onmouseover = highlight;
        rows[i].onmouseout = dehighlight;
    }
}

function highlight() {
    this.className = "highlight";
}

function dehighlight() {
    this.className = "";
}

Please can you shed some lights on it? Much appreciated.

Best regards,
Peter

[jamesbcox1980]

twikiTableOdd:hover, twikiTableEven:hover {
    background-color: #aaa !important;
}

Forget the javascript. Just use the !important keyword there and it will over write the properties no matter where it's found in the code.