innerHTML()で作成した要素へのクリックイベントを追加するには(jQuery)

main.js

 $("#update_profile").html("<input type='button' id='update' value='更新'>")

index.html

    <div id="update_profile"></div>

main.js

$("#update").click(function() { 
      console.log("click");
 })

#updateに対して直接Clickイベントを発生させても上手くいきません
これはjsファイル読み込み時には#updateが存在していないからですね
この場合はon()を使ってclickイベントを追加していきます。

main.js

$("#update_profile").on("click","#update", function() { 
      console.log("click");
});

on()には第一引数にはイベントを第二引数には実際にclickイベントを追加したい要素を間接的に指定しております。
もちろんですが親要素の#update_profileはjsファイルを読み込む前に存在していないといけないです。