Dynami c раскрывающийся список laravel с использованием ajax показывает, что не работает

Question

У меня есть 2 таблицы (jeniskegiatan и komponenkegiatan), я хочу заполнить раскрывающийся список на основе другого выбранного раскрывающегося списка. и заметив, что это произошло во втором раскрывающемся списке после того, как я выберу значение из первого раскрывающегося списка, вы можете мне помочь?

<form action="" method="POST" id="pengajuan_form">
                    <div class="card-body">
                        <div class="form-group">
                            <label>Dosen</label>
                            <select class="form-control select2bs4" name="dosen_id" id="dosen_id"
                                data-placeholder="Plih Dosen" style="width: 100%;">
                                <option selected disabled>--- Pilih Dosen ---</option>
                                @foreach ($dosenData as $dosen)
                                <option value="{{$dosen->nip}}">
                                    {{$dosen->nip}} || {{$dosen->nama_dosen}}
                                </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Jenis Kegiatan : </label>
                            <select class="form-control select2bs4 dynamic"  name="jk_id"
                                id="jk_id" style="width: 100%;">
                                <option selected disabled>--- Pilih Jenis Kegiatan ---</option>
                                @foreach ($jeniskegiatanData as $kk)
                                <option value="{{$kk->jk_id}}">
                                    {{$kk->nama_jk}}
                                </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Komponen Kegiatan : </label>
                            <select class="form-control dynamic2" data-placeholder="Komponen Kegiatan"
                                name="kk_id" id="kk_id" style="width: 100%;">
                                <option selected disabled>--- Pilih Komponen Kegiatan ---</option>
                            </select>
                            {{-- {{ csrf_field() }} --}}
                        </div>
                        <div class="form-group">
                            <label>File : </label>
                            <input type="file" id="file" name="file" class="input-file" accept=".pdf,.docs">
                        </div>

                    </div>
            </div>
            <!-- /.card-body -->
        </div>
        <!-- /.card -->
        <div class="row">
            <div class="container-fluid">
                <div class="col-12 justify">
                    <a href="#" class="btn btn-secondary">Cancel</a>
                    @csrf
                    <input type="submit" name="save" id="save" value="Save" class="btn btn-success float-right">
                </div>
            </div>
            </form>

и это мои javascripts

 $(document).ready(function(){
        $(document).on('change','.dynamic',function(){
            // console.log("hmm its change");

            var jk_id=$(this).val();
            // console.log(cat_id);
            var div=$(this).parent();

            var op=" ";

            $.ajax({
                type:'get',
                url:'{{route('admin.pc.fetch')}}',
                data:{'id':jk_id},
                success:function(data){
                    //console.log('success');

                    //console.log(data);

                    //console.log(data.length);
                    op+='<option value="0" selected disabled>chose product</option>';
                    for(var i=0;i<data.length;i++){
                    op+='<option value="'+data[i].id+'">'+data[i].nama_jk+'</option>';
                   }

                   div.find('.dynamic2').html(" ");
                   div.find('.dynamic2').append(op);
                },
                error:function(){

                }
            });
        });
    });

и этот мой контроллер

public function create()
    {
       $users = Auth::user();
       $jeniskegiatanData = jeniskegiatan::all();
        // $komponenkegiatanData = komponenkegiatan::all();
        $dosenData= dosen::all();
        return view('admin.pengajuan.create_pengajuan',compact('users','jeniskegiatanData','dosenData'));
    }
    
function fetch(Request $request)
    {

        //$request->id here is the id of our chosen option id

        $data=komponenkegiatan::select('nama_kegiatan','id')->where('jk_id',$request->id)->get();
        return response()->json($data);//then sent this data to ajax success
    }

Простите за плохой английский sh