modificar un span onmouseover

[engonga]

hola tengo una serie de <divs> que tendtro de dada uno tiene un <span>

Código HTML:

<div id="items_familie"> <div class="item_fam" style="background:url(imatges_productes/bici_electrica.jpg ) top left ;"> <span>Bicicletes</span> </div> 					 
                    <div class="item_fam" style="background:url(imatges_productes/ciclo_motor_electrico.jpg ) top left ;">
       <span>Ciclomotors</span> </div> 
                    <div class="item_fam" style="background:url(imatges_productes/cotxes_fons.jpg ) top left ;"> <span>Cotxes</span> </div> 
                    <div class="item_fam" style="background:url(imatges_productes/punto_recarga.jpg ) top left ;"> <span>Infraestructures de Rec&agrave;rrera</span> </div> 
                    <div class="item_fam" style="background:url(imatges_productes/motos_fons.jpg ) top left ;"> <span>Motocicletes</span> </div> 
                    <div class="item_fam" style="background:url(imatges_productes/cuadriciclo_electrico.jpg ) top left ;"             <span>Quadricicles</span> </div> 
                </div><!-- items_families --> 

y no se como hace para que cuando me pasen por encima de un div de modifique solo el css del aspn que esta dentro de este div

yo he probado con

Código HTML:

$(".item_fam").mouseover(function () {
                $("span").css("background","red");
                  });

pero me modifica todos los span

[InKarC]

Código Javascript:

$(".item_fam").mouseover(function () {
                $(this).find("span").css("background","red");
 });
 

$(this).find("span") hace que se busque solo en los nodos que tiene dentro.

[engonga]

y para que cuando el mouse deje de estar encima como se hace? la accion

[InKarC]

Código Javascript:

$(".item_fam").mouseenter(function () {
    $(this).find("span").css("background","red");
 }).mouseleave(function(){
    $(this).find("span").removeAttr("style")
});
 

Para que esta solucion sirva tiene que quitar los estilos anidados y colocarlos en un CSS
Para manejar elementos con nodos adentro es mejor mouseenter y mouseleave para evitar que el evento se 'dispare' en múltiples ovaciones no requeridas.