JQuery: div ripertuto, come selezionare?

[monteduro]

Ciao Ragazzi,
una piccola domanda su un problema che sfortunatamente non riesco a risolvere, nonostante abbia passato tre ore a cercare una possibile soluzione online.

Il punto è questo, ho un modello di questo genere in HTML:

<div id="ciao">                
    Apri        
    <div id="vista" style="display:none;">Visualizza</div>  
</div> 

<div id="ciao">                
    Apri        
    <div id="vista" style="display:none;">Visualizza</div>  
</div>

In sostanza un modulo di div che si ripete nella stessa pagina.

Ora con jQuery vorrei che cliccando su APRI si aprisse il DIV relativo. Ho provato con $this, parent() e roba simile ma nulla. Qualche idea?

Ecco come è il codice generale che ovviamente funziona solo per il primo:

$(".apri").click(function () {        
         $('#vista').slideDown(200);  	 
         event.preventDefault(); 
});

[Vindav]

prova cosi:

$(this).next().slideDown(200);

[monteduro]

Nada, non funziona neanche così. Sto veramente perdendo ogni genere di fantasia dietro a questo problema. Diamine.

[Vindav]

spiega perche non funziona!! vedi qualche errore nella console??
il codice che ti ho postato fa quello che chiedi... probabilmente devi solo capire come integrarlo nella pagina...

p.s. l'id di un elemento html dovrebbe essere sempre univoco...

[monteduro]

Ti spiego subito il perché, il codice che ho postato di esempio era effettivamente un esempio. Nel codice completo il div da aprire non è immediatamente di seguito alla classe che dovrebbe farlo comparire.

Ci sono altri div interposti tra i due ma sono comunque entrambi figli di un DIV che poi verrà ripetuto completamente.

Mi sono spiegato?

Grazie Vindav per le risposte!

PS: riguardo al fatto degli ID ripetuti è vero, dovrebbero essere le classi a ripetersi. Quindi se opto per le classi dici che funzionerebbe comunque, anche senza div e vari? non credo, giusto? Però è bene ottimizzare il codice.

[Vindav]

ok ora è chiaro
posta un esempio più dettagliato, con tutti gli elementi html ecc... cosi io o chi risponderà riuscirà a proporti soluzioni piu adatte al tuo problema...

[monteduro]

mi sono un attimo studiato come navigare nel DOM tramite jQuery e ho trovato finalmente la soluzione.

In sostanza, da quello che ho capito, la classe dell'evento click e il DIV da far apparire non avevano legami di parentela (cioè, non andavano ne con parents, ne con children) però in comune avevano il DIV generale, quello che andava ripetuto. Quindi ho pensato, posso risalire a tutti i DIV genitori del LINK e successivamente, da quella selezione, arrivare al DIV da slidare.

Ecco il risultato:

$('.apri').click(function(){
			$(this).parents(".ciao").find(".vista").slideDown(200); 
});

Ovviamente ho usato i parametri dell'esempio che ho fatto che, come ha fatto notare Vindav, non rispecchia la realtà del mio codice che è più annidato.

Grazie comunque Vindav, non avrei trovato la soluzione se comunque non avessi ottimizzato il codice come consigliato da te. Errori da babbo, come sempre!