cascading dropdown not Working in Laravel 7 - laravel

Question

i am trying to use cascading dropdown list in mvc. main category is working but in subcategory having some problem.it doesn't show any value when i choose from main category
in Blade:
<div class="form-group">
<label for="cat_id">Category <span class="text-danger">*</span></label>
<select name="cat_id" id="cat_id" class="form-control">
<option value="">--Select any category--</option>
#foreach($categories as $key=>$cat_data)
<option value='{{$cat_data->id}}'>{{$cat_data->title}}</option>
#endforeach
</select>
</div>
<div class="form-group" id="child_cat_div">
<label for="child_cat_id">Sub Category</label>
<select name="child_cat_id" id="child_cat_id" class="form-control">
<option value="">--Select any category--</option>
</select>
</div>
#push('scripts')
<script>
$('#cat_id').on('change',function(e) {
var cat_id=$(this).val();
// alert(cat_id);
if(cat_id !=null){
// Ajax call
$.Ajax({
url:"/backend/category/"+cat_id,
data:{
_token:"{{csrf_token()}}",
id:cat_id
},
type:"POST",
success:function(response){
if(typeof(response) !='object'){
response=$.parseJSON(response)
}
// console.log(response);
var html_option="<option value=''>Select sub category</option>"
if(response.status){
var data=response.data;
// alert(data);
if(response.data){
$('#loader').css("visibility", "visible");
// $('#child_cat_div').removeClass('d-none');
$.each(data,function(id,title){
html_option +="<option value='"+ id +"'>" + title +"</option>"
});
}
else{
}
}
else{
$('#child_cat_div').addClass('d-none');
}
$('#child_cat_id').html(html_option);
}
});
}
else{
}
}) </script> #endpush
in Route:
Route::POST('/category/{id}','Admin\CategoryController#getChildByParent');
in article Controller:
public function create()
{
$categories=Category::where('is_parent',1)->get();
$photos = Photo::all();
$tags = Tag::all();
$articles = Article::all();
return view('backend.articles.create',
compact('categories','photos','tags','articles'));
}
in Category Controller:
public function getChildByParent(Request $request){
$category=Category::findOrFail($request->id);
$child_cat=Category::getChildByParentID($request->id);
return response()->json([$child_cat]);
return response()->json([
'child_cat' => $child_cat]);
}
in model category:
public static function getChildByParentID($id){
return Category::where('parent_id',$id)->orderBy('id','ASC')->pluck('title','id');
}