Prenons 3 boutons radio :

<label for="repetition-1">
<input type="radio" name="repetition" id="repetition-1" value="1" />
Tous les mois</label>

<label for="repetition-2">
<input type="radio" name="repetition" id="repetition-2" value="2" />
Tous les jours</label>

<label for="repetition-3">
<input type="radio" name="repetition" id="repetition-3" value="3" />immédiatement</label>



Prenons 3 <div>

<div id="toto1"></div>
<div id="toto2"></div>
<div id="toto3"></div>



Nous voulons : Quand l'utilisateur clique sur le bouton radio ayant pour id "repetition-1" que le champ div ayant pour id "toto1" s'affiche et que les autres soient cachés.
Idem pour les deux autres boutons radio et div

Voici le code JQuery "qui va bien"

<script type="text/javascript">
	jQuery(window).ready(function(){
		jQuery("#repetition-1").click(function(){
			jQuery("#toto1").show("slow");
			jQuery("#toto2").hide("slow");
			jQuery("#toto3").hide("slow");
		});
		
		jQuery("#repetition-2").click(function(){
			jQuery("#toto1").hide("slow");
			jQuery("#toto2").show("slow");
			jQuery("#toto3").hide("slow");
		});
		 
		jQuery("#repetition-3").click(function(){
			jQuery("#toto1").hide("slow");
			jQuery("#toto2").hide("slow");
			jQuery("#toto3").show("slow");
		});
	});
</script>



Au cas où, le code pour insérer JQuery qui est necessaire et suffisant pour faire fonctionner cet exemple est :

<script type="text/javascript" src="/js/jquery/jquery-1.3.2.min.js"></script>