題名の件、みごとにハマってしまいました…

脳死で以下のようなイベントハンドラを書いて
いざ試そうとブラウザを更新、ボタンクリックしても動かない…

$(".submit-button").on("click", () => {
    $(this).foo().bar();
});

実は、()=>{}とfunction(){}ではthisの扱いが違うのです。

従来の無名関数function(){}ではclickイベントが発生した時点で
thisに$(".submit-button")が代入されます。

アロー関数式()=>{}ではclickイベントが発生する前に宣言した時点で
thisが決定されてしまうため、思うように動作しません。

このような違いがあるためイベントハンドラのような
呼び出したものによってthisの中身を変えたいような場合は無名関数を使いましょう。

以下に実践例を置いておきます。
レコードの削除などいったん確認手順を踏んでから確定させたいときに
使えそうなボタンです。

See the Pen
confirm by ささ (@mygod877)
on CodePen.