jQueryを使わず、動的にイベントリスナを追加する。

dynamicEvent.js

let elements = document.getElementsByTagName("div");
Array.from(elements, (element) => {
  if (element.classList.contains(".foo")) {
    element.addEventListener("click", () => {
      console.log("FOO!");
    })
  }
});

こうすべしってブログがあったんだけど、div全部取るなんて遅そうで怖いと思った。
いい方法無いのかな？

https://codepen.io/kjirou/pen/BwLRMr

jQuery の .on('eventName', selector, callback) を使うと、ネイティブの createElement で追加してもイベントがついてるなー
その辺を読むと何かテクがあるのかもしれない。

コードはこの辺かな？（まだ読んでない
https://github.com/jquery/jquery/blob/master/src/event.js#L37

なんか同僚に聞いたら、イベントのバブルアップを使って

document.body.addEventListener('click', function(event) {
  // 実際に click された要素
  const el = event.target;

  if (elにfooクラスがついてたら) {
    fooHandler();
  }
});

みたいなことすればできるんじゃねって言われた。

でも、これもYouのやつもやめた方がいいと思います（小声

jQuery のコードは途中で心が折れたので読んでませんが、先の例で ul.js-list だけにイベントがついてるので、やっぱりバブルアップを使ってそうと思った。

でも止めた方が・・・