Xerimi: jQuery ein DIV anzeigen ein anderes verstecken

Beitrag lesen

Hallo Leute

Ich habe folgendes Beispiel.
So wies jetzt ist funktioniert es, ich möchte nur eine Dynamische Version.

Ich möchte das picture1 und picture2... einfach nur "picture" heisst bei allen, falls ja mal mehrere hinzukommen.
Das gleiche mit hover1 und hover2... das ich nur "hover" habe.

Gibt es eine Möglichkeit die jQuery funktion umzuändern?

Mit $(this).next("div"); funktioniert es bei den "hover" aber wie geht es bei den "picture"?

  
<div id="square" style="width:370px; height:370px; border:1px solid #000;">  
    <div id="text">ALLE</div>  
    <div id="picture1" style="display:none;">BILD 1</div>  
    <div id="picture2" style="display:none;">BILD 2</div>  
</div>  
  
<div class="rollover">  
<div class="hover1">Hover 1</div>  
<div class="hover2">Hover 2</div>  
</div>  

  
<script>  
$('.hover1').mouseenter(function() {  
	$('#text').css('display','none');  
	$('#picture1').removeAttr('style');  
});  
$('.hover1').mouseleave(function(){  
	$('#picture1').css('display','none');  
	$('#text').removeAttr('style');  
});  
  
$('.hover2').mouseenter(function() {  
	$('#text').css('display','none');  
	$('#picture2').removeAttr('style');  
});  
$('.hover2').mouseleave(function(){  
	$('#picture2').css('display','none');  
	$('#text').removeAttr('style');  
});  
</script>  

Vielen Dank im Voraus
Gruss
Xerimi