I'm new to Ruby on Rails, and I'm trying to get ajax to work with a ajax tutorial on Tutorialspoint. But even after I include 'jquery-rails' gem into gemfile and use 'bundle install' command I still get "Uncaught ReferenceError: $ is not defined" error in my browser console, and ajax function doesn't work.
I still have to refresh the page to see the result.  

(I generated the codes with scaffold)

my index.view.erb

```

<h1>Ponies</h1>

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Description</th>
      <th colspan="3"></th>
    </tr>
  </thead>

  <tbody>
    <% @ponies.each do |pony| %>
      <tr>
        <td><%= pony.name %></td>
        <td><%= pony.description %></td>
        <td><%= link_to 'Show', pony %></td>
        <td><%= link_to 'Edit', edit_pony_path(pony) %></td>
        <td><%= link_to 'Destroy', pony, method: :delete, data: { confirm: 'Are you sure?' }, :remote => true, :class => 'delete_pony' %></td>
      </tr>
    <% end %>
  </tbody>
</table>

<br>

<%= link_to 'New Pony', new_pony_path %>

```

my destroy.js.erb

```
$('.delete_pony').bind('ajax:success', function() {
  $(this).closest('tr').fadeOut();
});

```

my ponies\_controller.rb

```
...

def destroy
    @pony.destroy
    respond_to do |format|
      format.html { redirect_to ponies_url, notice: 'Pony was successfully destroyed.' }
      format.json { head :no_content }
      format.js { render :layout => false }
    end
  end

...

```

gemfile

```
...

gem 'jquery-rails'

...

```

browser console

```
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)

```

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")

// 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)

//= require jquery
//= require jquery_ujs

```