Pues mira, me he puesto a mirar el código de jQuery y he encontrado dos cosas. Una no tiene relación pero es que el estilo .rowselected no se conserva con tu código.
Prueba a hacer click en una fila y se marca como .rowselected. Bien. Pero si vuelves a pasar el ratón por encima, se quita el .rowselected. No sé si es esto lo que quieres realmente, pero a mi me resulta extraño (ver nota más abajo).
Lo otro que he visto es que si quieres ver una cosa curiosa, prueba este código:
Código:
$(document).ready( function() {
$("table.RowOverMe tbody tr").mouseover( function() {
$(this).removeClass();
$(this).addClass("rowover");
}).mouseout( function() {
$(this).removeClass();
if($(this).is(":even")){
$(this).addClass("row2");
}else{
$(this).addClass("row1");
}
}).click(function(){
$(this).removeClass();
$(this).addClass("rowselected");
});
$("table.RowOverMe thead tr").addClass("header");
$("table.RowOverMe tbody tr:odd").addClass("row1");
$("table.RowOverMe tbody tr:even").addClass("row2");
});
Casi igual que el tuyo pero comprobando :even. Verás que siempre devuelve true.
¿Dónde está el misterio? Pues que en la línea
$(this) es siempre el elemento único que se está tratando. Es decir, siempre es un único objeto. En una lista de 1, el primero siempre tiene índice 0, que es par siempre e impar nunca.
¿Por qué? Claramente por el ámbito de resolución de $(this), que se tiene que referir por fuerza al objeto actual, no a la lista devuelta por $("table tr").
¿Cómo solucionar esto sin repetir código?
Ya lo pensaré, ahora tengo fiebre. Sorry.
Nota: Sobre lo que decía más arriba del estilo que se pierde. Una solución es no añadir y quitar clases sino aplicar .css("background-color", "tal"); y no quitarlo, sólo aplicar.