Element nach einem Radiobutton aus-/einblenden

[Fabian]

Hallo,

Ich möchte gerne eine Liste von Radiobuttons anlegen. Ein auf jeden Radiobutton folgender Container mit weiteren Formularelementen soll nur dann sichtbar sein, wenn der entsprechende Radiobutton angewählt ist. So 100% funktioniert das leider nicht: das angezeigte reagiert nicht darauf, ob ich einen Button anwähle. Mein Versuch:

input[type="radio"]+div{  
	display: none  
}  
input[type="radio"][checked]+div{  
	display: block  
}

Und der passende Ausschnitt aus der HTML-Datei:

<form>  
	<input type="radio" name="Zahlmethode" checked="checked"/> Beschreibung  
	<div><p>Versteckt!</p></div>  
	  
	<input type="radio" name="Zahlmethode"/>Beschreibung  
	<div><p>Versteckt!</p></div>  
</form>  

Das erste versteckte Element wird angezeigt, sobald ich die Seite lade. Schließlich ist ja der erste Radiobutton auch angewählt. Wenn ich jetz aber den anderen anklicke, passiert leider genau gar nichts (außer dass er angewählt wird). Wird dabei intern nicht das checked-Attribut gesetzt? Offenbar ja nicht, oder wie darf ich das verstehen?

Getestet habe ich das Ganze mit Firefox 3.6 und Iron 7.0.5. Ich hoffe, jemand kann ich hier etwas aufklären. Ich will dazu eigentlich ungern JS zu Hilfe nehmen.

Beste Grüße,
Fabian.