jquery - AJAX が挿入されたコンテンツ内で jQuery を使用する

Question

tl;dr:コンテンツを DOM にロードした後、追加された要素に jQuery がアクセスできる最も早い時間は?

---

現在、既存の JavaScript をリファクタリング中です。現在、ダイアログボックスにコンテンツをロードするモジュールがあり、コールバックでは、ダイアログがロードされた後、ダイアログの要素にイベントを添付します。

ダイアログをロードするモジュールが、ロードされたダイアログ要素の詳細を知っているのは好きではありません。代わりに、私が今取っているアプローチは、ダイアログをロードするモジュールが単にそれ以上のことをしないというものです。

イベントをアタッチする責任は、ダイアログ自体にあります。これを行う方法は、ダイアログに読み込まれるコンテンツのマークアップ内に JavaScript ファイルを埋め込み、イベントのバインドを行う init メソッドを呼び出すことです。

私が今直面している問題は、何らかの理由で、init メソッドで、jQuery がスクリプトが探している要素を見つけられないことです。まだDOMにロードされていないようです。

ダイアログがロードされた後、コンソールから要素を手動で探すと、問題なく動作します。

私の質問は、AJAX 呼び出しを行うとき、どの時点で jQuery が新しく追加された要素にアクセスできるかということです。

ダイアログ マークアップ内に JavaScript を埋め込むという私のアプローチについてどう思いますか? ダイアログをロードするモジュールがイベントを初期化するために使用できるコールバックを常に持つことができますが、ダイアログをさまざまな場所からロードできるように、ダイアログ内のロジックをできるだけカプセル化しようとしています。私の開始コードを繰り返します。

イベントを添付して、コンテンツが DOM に追加された後にロジックを実行するためのより良い方法はありますか?

ダイアログのロード:

loadMemberLoginHistoryDialog: function(memberId) {
    var dialogOptions = {
        onComplete: function(responseHtml) {}
    };
    var dialogUrl = '/members/' + memberId + '/loginHistoryDialog';
    $.favsDialog(dialogUrl, dialogOptions);
}

ダイアログに読み込まれるコンテンツのマークアップのスクリプト:

        <script src="/js/zMemberLoginHistoryDialog.js" type="text/javascript"></script>
        <script>
            favsManageMemberLoginHistoryDialog.init('@Constants.LanguageCode');
        </script>

favsManageMemberLoginHistoryDialog モジュール:

var favsManageMemberLoginHistoryDialog = function() {
   function initializeControls() {
        $(".frmManageMembersMemberDelete")
            .submit(function() {
            if (confirm("Are you sure?")) {
                return true;
            }
            return false;
        });
    }

    return {
        init: function(language) {
            languageCode = language;
            initializeControls();
        }
    }; //return
}