jquery - jQueryは次に近いクラスを選択します

Question

FAQの簡単なリストがあります

<div class='qcontainer'>
    <p>Q:</p>
    <div class='question'>Question</div>
</div>
<div class='acontainer'>
    <p>A:</p>
    <div class='answer'><p>Answer</p></div>
</div>
<div class='qcontainer'>
    <p>Q:</p>
    <div class='question'>Question</div>
</div>
<div class='acontainer'>
    <p>A:</p>
    <div class='answer'><p>Answer</p></div>
</div>

私がやろうとしているのは、質問がクリックされたときに次の回答者の表示状態を切り替えることだけです。

これまでのところ私は持っています

   $('.qcontainer').bind("click", function (e) {
        $('.qcontainer').next('.acontainer').toggle(400);
    });

しかし、これはすべての項目を切り替えます。私がやりたいのは、クリックされた質問の回答をターゲットにすることです。したがって、クリックされたオブジェクトのリスト内の次のアイテム。

Answer 1

以下のようにしてみてください、

$('.qcontainer').bind("click", function (e) {
    $(this).next().toggle(400);
});

あなたが持っているマークアップについては、.nextof qcontainerisなので、トグルにacontainer使用するだけで、何も心配する必要はありません:).nextacontainer

Answer 2

$('.qcontainer').bind("click", function (e) {
        $('.acontainer:visible').hide(0);
        $(this).nextAll('.acontainer').show(400);
    });

Answer 3

近くにいたようです！

$('.qcontainer').bind("click", function () {
    $(this).next('.acontainer').toggle(400);
});

Answer 4

これを試して、うまくいくか教えてください。回答DIVには、閉じられていない「DIV」が1つあります。

    <div class='qcontainer'>
        <p>Q:1</p>
        <div class='question'>Question</div>
    </div>
    <div class='acontainer'>
        <p>A:</p>
        <div class='answer'><p>Answer</p></div>
    </div>
    <div class='qcontainer'>
        <p>Q:2</p>
        <div class='question'>Question</div>
    </div>
    <div class='acontainer'>
        <p>A:</p>
        <div class='answer'><p>Answer</p></div>
    </div>