css/js issues with ie

Can anyone have a look at the below code and let me know what I am doing wrong. It views perfectly in firefox but not at all in ie Am sure it has something to do with the js because the css looks to be fine Thanks for your help!

HTML:

<li class="to-left">
<ul class="out standingsRow" onmouseover="this.className = 'hover standingsRow';" onmouseout="this.className = 'out standingsRow';" onclick="window.location.href='http://www.ddkarting.com/daredevin.htm';">
<li class="One">1</li>
<li class="Two">&nbsp;</li>
<li class="One">&nbsp;</li>
<li class="Two">&nbsp;</li>
<li class="One Red">0</li>
</ul>
</li>

Code (markup):

CSS:

#standingsAll ul.standingsRow li.One {display:block;width: 50px;}
#standingsAll ul.standingsRow li.Two {display:block;width: 130px;}
.out {background-color: #fff;color: #1f0e82;cursor: hand;text-decoration:none;}
.hover {background-color: #1f0e82;color: #fff;cursor: hand;text-decoration: none;}
#standingsAll ul.standingsRow li {float: left;padding: 0;font-family:Arial,Geneva,sans-serif;font-size: 10px;font-weight:bold;line-height: 18px;text-align: left;padding-left: 5px;border-top: 1px solid #1f0e82;border-left: 1px solid #1f0e82;border-bottom: 1px solid #1f0e82;border-right: 1px solid #1f0e82;}
#standingsAll ul.standingsRow {display:table-cell;list-style-type: none;padding: 0;margin: 0;border-bottom: 1px solid #1f0e82;}

Code (markup):

Code in action can be viewed at: http://www.ddkarting.com/kidkart.htm

In Firefox the color change onmouseover works but in ie it color changes everything to white Thanks for your help you guys.

 

I'm not positive, but I think IE doesn't support .hover, IE7 will support it.
http://blogs.msdn.com/ie/archive/2005/07/29/445242.aspx

I think it's CSS2, which IE doesn't handle yet. I am still learning about this myself, however.