セレクター"#quiz_list_wrap .row"
が何にも一致しないため、クリックハンドラーが呼び出されることはありません。そのセレクターは、クラスを持つその子孫を探します。ただし、サンプルHTMLにはクラスがあります。#quiz_list_wrap
row
#quiz_list_wrap
row
(質問の更新された構造には、もはやその問題はありません。)
これとは別に、を指定しましdiv
たid
。したがって、ドキュメントには1つしか存在できません。を選択するには、次のdiv
ようにします。
var levelDiv = $("#level");
それが要素の子孫である場合にのみ#quiz_list_wrap
それを見つけたい場合、そしてクリックでそれを見つけたいだけなら、あなたはそれを次のように行うことができますfind
:
$(document).on("click","#quiz_list_wrap",function(event){
// ------------------ note change -----^
var levelDiv = $(this).find("#level");
});
さて、あなたのHTMLが実際にこのように見えた場合(私はの子要素を追加し、レベルdivrow
のをに変更したので、複数持つことができます):id
class
<div id="quiz_list_wrap">
<div class="row">
<div class=level>bla bla
</div>
</div>
</div>
...次に、クリックハンドラーが元のセレクターで呼び出され、ハンドラー内で$(this).find("div.level")
(または単に$(this).find(".level")
)それを見つけるために使用します。
最後に、子セレクターと言ったのでfind
、子孫(子、孫など)を探すことについて説明します。本当に子供だけを見たい場合は、$(this).children("selector here")
代わりに使用してください。