javascript - jQuery - 動的に生成された子がクリックをトリガーしない

Question

私のコード:

$(".test1").children().click(function(){
    $(".test2").append('<span>something</span>');           
});

$(".test2").children().on('click', function(){
    alert("done");      
});

「何か」を含むスパンは、test1 の子をクリックした後の test2 の最後の子である必要があります。私の追加は正しく行われていますか？test2 のクリック イベントは正しく実行されていますか?

どうも！

Answer 1

これは機能します：

$(".test1").children().click(function(){
    $(".test2").append('<span> something</span>');           
});

$(".test2").on('click', 'span', function(){
    alert("done");      
});

ライブデモ

Answer 2

追加について少し説明します。追加は適切ですが$(".test2").children()、新しい子が追加される前にクリックイベントをアタッチします（test1がクリックされます）。したがって、クリックイベントがスパンにアタッチされることはありません。