【jQuery】動的に追加した要素へのclickイベントが発火しない時の対処法

質問を受けて調べたので備忘録としてまとめ。
ｊQuery のクリックイベントが発火しない時の対処法についてです。

今回参考にさせていただいた記事はこちらから。

jQueryのclickイベントが動作しない？Ajaxなどで遅延読み込みした要素へのイベント登録方法を確認しよう。 | WEMO
https://wemo.tech/386

タイトルにもある通り、今回は Ajax などを使って動的に追加した要素に対してクリックイベントを発火させたい場合です。
動的に要素を追加した場合、JavaScript を読み込んだ時点ではまだその対象の要素が読み込まれていないため、下記の方法ではクリックイベントを発火させることができません。

$(function(){
    $('要素').click(function(){
        // 実行したい処理を記述
    });
});

そのため、下記のように document を対象にイベント発火の処理を指定すればOKです。

$(function()){
    $(document).on('click', '要素', function(){
        // 実行したい処理を記述
  });
});

上記のコードの書き方に修正したところ、問題なく動作することを確認できました！

以上、ｊQuery で動的に追加した要素へのクリックイベントが発火しない時の対処法でした。
ご参考になれば幸いです。