Perdon por el titulo tan poco concreto.
Me explico, tengo un boton al que le quiero otorgar una accion de mouseover y que esta accion la ejecute sobre un div concreto, ejemplo.
Código HTML:
<div class="precio">25<em style="font:normal normal 40px idealista_lightregular; font-size:17px;">$</em></div>
<div class="button"></div>
"precio" es una pequeña cartela donde el background tiene un color y el texto otro.
Al pasar el mouse sobre "button", ambos colores de "precio" cambian.
Hasta ahi bien, el codigo es este:
Código:
$(document).ready(function(){
$(".button").mouseover(function() {
$(".precio").css("background-color", "#e7e7e7");
$(".precio").css("color", "black");
});
$(".button").mouseout(function() {
$(".precio").css("background-color", "#ff9a00");
$(".precio").css("color", "white");
});
});
Seguramente se pueden simplificar mas los datos.
La cuestion es que en la misma pagina tengo varios div iguales, osea el mismo class y simplemente pos pasar el mouse sobre un "button" todos los "precio" cambian y no quiero que sea asi.
He probado dandole diferentes id, y funciona pero son infinidad de ellos y no creo que sea la mejor solucion.
¿Teneis algun consejo?