ajax - jQueryがgetJSONから要素を選択できません

Question

メソッドで .each メソッドを使用して、.getJSONオブジェクトを JSON ファイルに出力しています。これは正常に機能しますが、印刷された要素にクリック機能を追加できません。「クリック」IDで関数をdivにバインドしようとしています。

var loadData = function () {
    $.getJSON("profiles2.json", function (data) {
        var html = [];
        html.push("<div id='click'>Click here</div>");
        $.each(data.profiles, function (firstIndex, firstLevel) {
            html.push("<h2>" + firstLevel.profileGroup + "</h2>");
        });
        $("#data").html(html.join(''));
    });
};
$(document).ready(function () {
    loadData();
    $("#click").click(function () {
        console.log('clicked');
    });
});

Answer 1

$.getJSON は非同期呼び出しであり、DOM に挿入される要素にバインドしようとしているときには、おそらく終了していません。ページの下部に要素を追加した後、バインディングを $.getJSON 呼び出し内に配置します。