Как показать конкретную категорию на основе выбора раскрывающегося списка

У меня есть таблица категорий и таблица клубов, связь между ними

• Категория имеет много клубов
• 1 категория может иметь много клубов
• 1 клуб имеет 1 категорию

Я хочу показать клубы на основе категории, которая будет выбрана в раскрывающемся списке, поэтому другие клубы будут скрыты. См. снимок экрана для большего понимания

1. Мой контроллер (у меня нет проблем с выводом имен категорий в раскрывающийся список):

    public function club()
    {
        $categories_name = Category::pluck('category_name','id'); 
        $user_id = auth()->user()->id;
        $user = User::find($user_id);
        $data = array(
            'user_clubs' => $user->clubs,
            'categories_name' => $categories_name
        );
        return view('pages.dashboard.club_dashboard')->with($data);
    }

2. Мой вид

<div class = "form-group">
        <strong>{{Form::label('categories_name', 'Select Category')}}</strong>
        {{Form::select('categories_name', $categories_name, null, ['class' => 'form-control'], array('name'=>'categories_name[]'))}}
</div>

@if (count($user_clubs)>0)
<table class = "table table-striped">
    <tr>

        <th><strong>Club Name</strong></th>
        <th></th>
        <th></th>
    </tr>
    @foreach ($user_clubs as $club)
    <tr>
        <th>{{$club->club_name}} | {{$club->category->category_name}} </th>
        <td><a href = "/clubs-soc/lists/{{$club->id}}/edit" class = "btn btn-warning">Edit</a></td>
        <td>
            {!!Form::open(['action' => ['ClubsController@destroy', $club->id], 'method' => 'POST', 'class' => 'float-right'])!!} 
            {{Form::hidden('_method','DELETE')}} 
                {{Form::submit('Delete', ['class' => 'btn btn-danger'])}} 
            {!!Form::close()!!}
        </td>
    </tr>
    @endforeach
</table>
@else
<p>You Have No posts</p>
@endif

3. Модель категории

class Category extends Model
{
    public function user(){
        return $this->belongsTo('App\User');
    }

    public function clubs(){
        return $this->hasMany('App\Club');
    }
}

4.Клубная модель

class Club extends Model
{
    public function user(){
        return $this->belongsTo('App\User');
    }

    public function category(){
        return $this->belongsTo('App\Category');
    }
}

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js>">
    onchange alert($("#categories_name").length);
    console.info($("#categories_name").length);  
    $(document).ready(function(){
        $("#categories_name").on("change", function(){
            var category_id = $(this).val();
            $("table tr").each(function(index){
                if (index != 0) {
                    $row = $(this);
                    if ($row.attr('id')!=category_id) {
                        $row.hide();
                    }
                    else {
                        $row.show();
                    }
                }
            });
        });
    });​
</script>

Я написал этот скрипт из ответа ниже, он все еще не работает, пожалуйста, помогите мне найти, где я допустил ошибку? куда мне поставить скрипт?