jquery - 挿入された HTML に jQuery がない

Question

特定のクラスの要素をクリックして何かを行うために、ページの先頭に jQuery をロードしました。

$(function(){
  $(".addtocal").click(function(){
  $(this).next('.addToCalOptions').fadeIn('fast');
  return false;
  }
);
});

ページに既に存在するすべての .addtocal 要素に対して機能します。ただし、後で jQuery .load 関数によって一連の同様の要素がページに挿入されるわけではありません。

これで、.on() 関数で「デリゲート イベント アプローチ」を使用する必要があると確信しました。右？

ただし、これは機能しません。

$(function(){
  $("a").on("click", ".addtocal", function(){
  $(this).next('.addToCalOptions').fadeIn('fast');
  }
);
});

道に迷いました。何かご意見は？ありがとう！