いいね機能の非同期通信が実装できません

Question

前提・実現したいこと

現在いいね機能を非同期でやりたいのですが、うまくいきません。
エラー画面は出ていません。

ユーザー（User）、投稿情報（UserInfo）、お気に入り（Favorite）というふうにモデルが作っています。
ユーザーが、他人の投稿情報に、お気に入りするといった流れになります。

現在の状況は、
・お気に入りボタン、解除ボタンを押してリロードしないと色が変わらない。
・お気に入りボタン、解除ボタンを押してリロードする前にデータベースを見ると、データの反映はされている。
というふうなものです。

該当のソースコード

こちらは投稿情報を表示しているindex.html.erbです。

・
・（省略）
・
<div id="favorites_buttons_<%= user_info.id %>">
　<%= render partial: 'favorites/favorite', locals: { user_info: user_info} %>
</div>
・
・（省略）
・

こちらは、favorites/favoriteファイルです。上記のindexファイルにて、render partialで指定しているファイルになります。

<% if user_signed_in? && user_info.user_id != current_user.id %>
  <% if user_info.favorited_by?(current_user) %>
    <p class="followed_btn"><%=link_to "お気に入り済", user_info_favorite_path(user_info.id, 1), class: "white", method: :delete, remote: true %></p>
    <% else %>
    <p class="follow_btn"><%=link_to "お気に入り", user_info_favorites_path(user_info.id), class: "white", method: :post, remote: true %></p>
  <% end %>
<% end %>

こちらはapplication.jsです。

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

require("@rails/ujs").start()
//require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
//require('jquery')




// Uncomment to copy all static images under ../images to the output folder and reference
// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
// or the `imagePath` JavaScript helper below.
//
// const images = require.context('../images', true)
// const imagePath = (name) => images(name, true)

こちらはcreate.js.erbです。

$('#js-favorites-buttons-for-board-<%= @user_info.id %>').html("<%= j(render partial: 'favorites/favorite', locals: {user_info: @user_info}) %>");

こちらはdestroy.js.erbです。

$('#js-favorites-buttons-for-board-<%= @user_info.id %>').html("<%= j(render partial: 'favorites/favorite', locals: {user_info: @user_info}) %>")

こちらはfavoritesコントローラーです。

・
・（省略）
・
def create
    @user_info = UserInfo.find(params[:user_info_id])
    favorite = current_user.favorites.build(user_info_id: params[:user_info_id])
    favorite.save
  end

  def destroy
    @user_info = UserInfo.find(params[:user_info_id])
    favorite = Favorite.find_by(user_info_id: params[:user_info_id], user_id: current_user.id)
    favorite.destroy
  end
・
・（省略）
・

試したこと

お気に入り登録はkazukimatsumotoさん、Ajaxはnaberinaさんのサイトを、少し変更を加えて参考にさせていただいています。

はじめ、Ajaxのコードを丸々写して見たのですが、NoMethodErrorが出ていました（ ; ; ）
それを踏まえて、application.jsなどを変更したところ、現在に至ります。

gem 'jquery-rails'はインストール済み、サーバー再立ち上げもしています。

追記①：application.jsのrequire("turbolinks").start()をコメントアウトしましたが、変わりありませんでした。

追記②
こちらはお気に入りボタンを押した際のターミナルです。

Processing by FavoritesController#create as JS
  Parameters: {"user_info_id"=>"15"}
  UserInfo Load (0.5ms)  SELECT `user_infos`.* FROM `user_infos` WHERE `user_infos`.`id` = 15 LIMIT 1
  ↳ app/controllers/favorites_controller.rb:40:in `set_user_info'
  CACHE UserInfo Load (0.0ms)  SELECT `user_infos`.* FROM `user_infos` WHERE `user_infos`.`id` = 15 LIMIT 1  [["id", 15], ["LIMIT", 1]]
  ↳ app/controllers/favorites_controller.rb:27:in `create'
  User Load (0.4ms)  SELECT `users`.* FROM `users` WHERE `users`.`id` = 10 ORDER BY `users`.`id` ASC LIMIT 1
  ↳ app/controllers/favorites_controller.rb:28:in `create'
   (0.1ms)  BEGIN
  ↳ app/controllers/favorites_controller.rb:29:in `create'
  UserInfo Load (0.2ms)  SELECT `user_infos`.* FROM `user_infos` WHERE `user_infos`.`id` = 15 LIMIT 1
  ↳ app/controllers/favorites_controller.rb:29:in `create'
  Favorite Create (0.2ms)  INSERT INTO `favorites` (`user_id`, `user_info_id`, `created_at`, `updated_at`) VALUES (10, 15, '2020-10-06 11:47:52.759534', '2020-10-06 11:47:52.759534')
  ↳ app/controllers/favorites_controller.rb:29:in `create'
   (0.6ms)  COMMIT
  ↳ app/controllers/favorites_controller.rb:29:in `create'
  Rendering favorites/create.js.erb
  Favorite Exists? (0.3ms)  SELECT 1 AS one FROM `favorites` WHERE `favorites`.`user_info_id` = 15 AND `favorites`.`user_id` = 10 LIMIT 1
  ↳ app/models/user_info.rb:24:in `favorited_by?'
  Rendered favorites/_favorite.html.erb (Duration: 1.7ms | Allocations: 940)
  Rendered favorites/create.js.erb (Duration: 1.9ms | Allocations: 1043)
Completed 200 OK in 15ms (Views: 2.1ms | ActiveRecord: 2.4ms | Allocations: 7413)

追記③：application.jsのrequire('jquery')にコンソール上でエラーになっていたので、コメントアウトしました。またその後、ボタンを押すと以下のようなエラーが起きました。

VM298:1 Uncaught ReferenceError: $ is not defined
    at <anonymous>:1:1
    at processResponse (rails-ujs.js:283)
    at rails-ujs.js:196
    at XMLHttpRequest.xhr.onreadystatechange (rails-ujs.js:264)

Answer 1

indexにて、以下の記述をすることで解決しました。
考えていただいた方、ありがとうございました。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>