Mouseover - Mouseout en distintos div's

[hmbp22]

tu codigo jquery quedaria asi:

Código HTML:

$(document).ready(function(){
    $(".hover").mouseover(function (){
        $(this).prev().slideDown("middle");
    });
    
    $(".hover").mouseout(function (){
        $(this).prev().slideUp("fast");
    });
});​
 

y tu html asi:

Código HTML:

<div class="texto" style="width:207px; position: absolute; background:#CCCCCC; display:none"><span>HOLA</span></div>
<div class="hover" style="background:#006699; z-index:-1; width: 207px; height: 111px"></div>
<br />
<div class="texto" style="width:207px; position: absolute; background:#CCCCCC; display:none"><span>HOLA</span></div>
<div class="hover" style="background:#006699; z-index:-1; width: 207px; height: 111px"></div>
 

Lo mismo que mencionas sobre usar class en lugar de id se aplica a los divs .
Y jQuery tiene muchos metodos para refinar/modificar las selecciones:
http://api.jquery.com/category/traversing/