Solución:
Sugeriría usar CSS sobre jquery (si es posible); de lo contrario, puede usar algo como esto
$("div.myclass").hover(function() {
$(this).css("background-color","red")
});
Puede cambiar su selector según sus necesidades.
Como comentó @ A.Wolff, si desea usar este efecto de desplazamiento en varias clases, puede usarlo así
$(".myclass, .myclass2").hover(function(e) {
$(this).css("background-color",e.type === "mouseenter"?"red":"transparent")
})
Demostración de Js Fiddle
Puedes probar esto:
$(".myclass").mouseover(function() {
$(this).find(" > div").css("background-color","red");
}).mouseout(function() {
$(this).find(" > div").css("background-color","transparent");
});
MANIFESTACIÓN
Sé que esto tiene una respuesta aceptada, pero si alguien se encuentra con esto, mi solución puede ayudar.
Encontré esta pregunta porque tengo un caso de uso en el que quería desactivar el estado: hover para los elementos individualmente. Dado que no hay forma de hacer esto en el DOM, otra buena forma de hacerlo es definir una clase en CSS que anule el estado de desplazamiento.
Por ejemplo, el css:
.nohover:hover {
color: black !important;
}
Luego con jQuery:
$("#elm").addClass("nohover");
Con este método, puede anular tantos elementos DOM como desee sin vincular toneladas de eventos onHover.