[Jquery]N'impacter qu'une instance d'une classe...[Résolu]

Bonjour à tous,

Je cherche à réaliser une page sur laquelle j'ai plusieurs blocs que je souhaite rendre repliable/dépliable tout en changeant la classe du lien déclencheur au click.

L'idée est que chaque bloc soit indépendant (ex: je dois pouvoir déplier les blocs 1 et 3 tout en gardant le 2 fermé), pourtant j'aimerai n'utiliser qu'une seule classe pour tous ces blocs.

Mon code dans son état actuel a pour effet que chaque lien déplie toutes les divs (en changeant les classes de tous les liens déclencheurs). Je me suis inspiré du tutorial de Thomas D mais mes contraintes ne sont pas les mêmes car l'ouverture d'un bloc ne doit pas déclencher la fermeture de tous les autres.
J'aimerai ne pas avoir a créer autant de classe que de bloc car ça me semble assez moche et j'ai l'impression qu'une solution existe.

Voici mon code html

<h4><span class="toggle_trigger">Titre 1</span></h4>
	<div class="toggle_container">
               contenu del a div 1
	</div>

        <h4><span class="toggle_trigger">Titre 2</span></h4>
	<div class="toggle_container">
               contenu del a div 2
	</div>

Et le javascript

$(document).ready(function () { 
    //Repliage div
    $(".toggle_trigger").click(function() {
			$(".toggle_container").slideToggle("slow");
			$(".toggle_trigger").toggleClass("selected");
			return false; 
			}) 
}); 

J'ajoute que je débute complètement, je vous remercie donc pour votre indulgence
Modifié par samo1986 (04 Apr 2010 - 20:27)

Regarde ça dans la doc

$(this)

Effectivement, le $(this) me permet bien de modifier le style pour le lien cliqué. Par contre, je ne parviens pas à selectionner le div qui suit directement le lien afin de l'afficher. J'utilise la fonction next(), manifestement pas correctement

Voici mon code:

$(".toggle_trigger").click(function() {
			$(this).next(".toggle_container").slideToggle("slow");
			$(this).toggleClass("selected");
			return false; 
			}) 

Une solution pourrait être $(this).parent().next()

C'est ça!
Je venais de trouver l'explication ici : http://groups.google.com/group/jquery-en/browse_thread/thread/1797ad2ead3a8443?pli=1

Le bon code est donc

$(".toggle_trigger").click(function() {
			$(this).parents().next(".toggle_container").slideToggle("slow");
			$(this).toggleClass("selected");
			return false; 
			}) 

Merci Paolo pour tes conseils