用途

使用方法

効く書き方

$(.hoge1).on("click", ".hoge2", function(){
  // クリックした際の処理を書く
});

hoge1クラスがhoge2クラスの親要素。
hoge2クラスはページ読み込み後にjsで追加された要素。

このコードが効く理由
親要素である「hoge1クラス」はページ読み込みの際には存在していて、後から追加した「hoge2」クラスも「hoge1クラス」に on をしたことに含まれているから、このような形で効くようになる。
　

効かない書き方

$(.hoge2).on("click", function(){
  // クリックした際の処理を書く
});

上記のコードが効かなかった理由
ページ読み込みの際には「hoge2クラス」は存在しておらず、その要素に対して on をしていたから。
※一般的なhtmlに対しては効く。jsで後から追加した要素には効かない。
　
　
　
下記のサイトを参考に執筆しました。