jQueryの - それはここに私のhtmlコードである

Question

ことで、クラスと実行機能を追加します.new-1にマッピングされて機能しないのはなぜ

$(".wrap a").on("click", function(){ 
    $(this).addClass("new-one"); 
    $(this).siblings("a").removeClass("new-one"); 
}); 
$(".new-one").on("click", function() { 
    console.log("I was hit!"); 
}); 

：私はこのjQueryのを作成している

<div class="wrap"> 
    <a href="#">Button</a> 
    <a href="#">Button</a> 
</div> 

作業？どうすれば修正できますか？

Answer 1

delegateイベントハンドラが必要です。このようなもの。

$(".wrap").on("click", ".new-one", function() { 
    console.log("I was hit!"); 
}); 

Answer 2

上記の回答は、最終目標を達成するのに最適な方法です。期待どおりのコードが動作しない理由として、この例で は、コード：

$(".new-one").on("click", function() { 
    console.log("I was hit!"); 
}); 

は、スクリプトがロードされたときに、一度だけ実行してきています。このコードが実行されると、ページに ".new-class"という要素がないため、クリックイベントは付加されません。 コンテナ要素にclickイベントを入れ、.new-oneクラスの子にのみ委譲すれば正常に動作します。