Hintergrund einer Zelle ändern

[ralf]

Hallo,

ich hab folgenden Code:

Style:
<style type="text/css">
.navitem { font-family: Arial; font-size: 12px; background-color: #FFFFFF; text-align: center; vertical-align: bottom; border: 1px solid #FFFFFF; width: 100px; }
.navitem_over { font-family: Arial; font-size: 12px; text-align: center; vertical-align: bottom; border: 1px solid #D9D9D9; width: 100px; }
</style>

JavaScript:
function onMenu(element) {
 element.className="navitem_over";
}
function offMenu(element) {
 element.className="navitem";
}

Die Funktionen werden so aufgerufen:
<td class="navitem" onMouseOver="onMenu(this)" onMouseOut="offMenu(this)"><a href="index.php">Moskito</a></td>
<td class="navitem" onMouseOver="onMenu(this)" onMouseOut="offMenu(this)"><a href="index.php">Albatros</a></td>
<td class="navitem" onMouseOver="onMenu(this)" onMouseOut="offMenu(this)"><a href="index.php">Campus</a></td>

Das Funktioniert auch ganz gut, nur möchte ich jetzt das sich für jeden Link die Hintergrundfarbe ändert, und zwar nicht alle gleich sondern in drei Verschiedenen Farben.

Ich hab folgendes Probiert:
function onMenu(element,color) {
 element.className="navitem_over";
        element.style.background-color=color;
}

In der Zelle hab ich es so aufgerufen: onMouseOver="onMenu(this,'#FF0000)"

Aber das hat leider nicht funktioniert

Jemand ne Idee wie man das machen kann?

Danke und Gruß

Ralf