How to create pagination with ajax?

I have this view called categories/index.blade.php which gets included in index.blade.php:

@foreach($categories as $category)
    <tr>
        <td>{{ $category->name }}</td>
        <td>{{ $category->getParent->name }}</td>
        <td>
            <form action="{{ route('categories.destroy', ['id' => $category->id]) }}" method="post">
                @method('delete')
                @csrf()
                <div class="btn-group btn-group-sm">
                    <a href="{{ route('categories.edit' , ['id' => $category->id]) }}"  class="btn btn-primary">edit</a>
                    <button type="submit" class="btn btn-danger">delete</button>
                </div>
            </form>
        </td>
    </tr>
@endforeach
.
.   
.

{!! $categories->links() !!}

CategoryController.php

public function index(Request $request)
{
    if ($request->ajax()) {
        $categories = Category::latest()->paginate(5);
        return view('Admin.categories.index', compact('categories'));
    }
}

web.php

Route::resource('categories', 'CategoryController');

ajax

<script>
    $(document).ready(function () {
        $(document).onclick('.pagination a', function (event) {
            event.preventDefault();
            var page = $(this).attr('href').split('page=')[1];
            fetch_data(page);
        });
        function fetch_data(page) {
            $.ajax({
                url: 'fa/admin/categories?page='+page,
                success: function (data) {
                    $('.table-responsive').html(data);
                }
            })
        }
    });
</script>