JQuery next (): Obtenir le frère suivant en utilisant uniquement des classes

Je suis en train de créer quelque chose comme un web accordéon.

Visual exemple:

[TITLE DIV 1]
[CONTENT DIV 1]
[TITLE DIV 2]
[CONTENT DIV 2]
[TITLE DIV 3]
[CONTENT DIV 3]

Je veux être en mesure de basculer (jquery fonction toggle()) un "Contenu de la Div" en cliquant sur le Titre "Div".

J'ai essayé, mais ça ne fonctionne pas.

http://jsfiddle.net/Cs3YY/

HTML:

<div class="topSeparator"></div>
<div class="titleDiv">
    <h1>Title 1</h1>
</div>
<div class="bottomSeparator"></div>                 
<div class="contentDiv"><h2>Content 1</h2></div>

<div class="topSeparator"></div>
<div class="titleDiv">
    <h1>Title 2</h1>
</div>
<div class="bottomSeparator"></div>                 
<div class="contentDiv"><h2>Content 2</h2></div>

JQUERY:

$('.titleDiv').click(function() {       
        $(this).next('.contentDiv').toggle();
});

http://jsfiddle.net/Cs3YY/

Je décrirais ma fonction de processus en tant que tel:

  1. Lorsque vous cliquez sur un élément avec une classe nommée "titleDiv", n':

1.1. Sélectionnez cliqué élément;

1.1.1. Sélectionnez le frère suivant de l'élément cliqué avec une classe nommée "contentDiv";

1.1.1.1. La fonction toggle() loi sur ce dernier élément (Avec le nom de la classe "contentDiv");

Il semble que je me trompe ou il me manque quelque chose.

.

Je suis, y compris jquery 1.8.3 (Correctement).

Cela fonctionne lors de l'utilisation de l'ID au lieu de classes (j'essaie d'éviter de les utiliser).

J'ai placé une alerte à l'intérieur de la fonction de clic et cela fonctionne (Le problème est à l'intérieur).

OriginalL'auteur Edu | 2013-02-15