aタグの二回目のクリックを無効化しつつコントローラでの処理を実行させたい

Question

aタグの二回目のクリックを無効化するためにjsファイルに処理を書いたのですが、無効化はされるのですが肝心のコントローラでの処理が実行されません。
恐らくjsファイル内の処理が優先されるためだと思います
link_toメソッド内でonclickオプションを使えば良いのですが、aタグを無効化しつつ、aタグの色を変化させるという複数処理を書くとうまくいきませんし、何よりコードが長くなって見栄えが良くありません。jsファイル内でどのようにすればaタグの二回目のクリックを無効化し、色を変え、なおかつコントローラでの処理も実行させることができますか？

<td class="align-middle"><%= link_to "覚えた", "/words/#{result.q_id}/learned_word", {method: :post, class: "learned_btn"} %></td>

def learned_word
    Word.find(params[:id]).destroy
end

$(function() {
    $('.learned_btn').on('click', function(event) {
        $(this).css('color', '#7a837f');
        return false
    })
});

Answer 1

aタグを無効化するのではなく、pointer-eventsをnoneとすることで解決しました