Как реализовать кнопку «Показать больше» на laravel

Question

Я пытаюсь добавить кнопку «Показать больше» в свой проект, используя запрос Ajax, но я не получаю то, что мне нужно

Метод в модели:

public static function collectNewProjects(){
    $newProjects = Project::where('status_id', StatusProject::IN_PROGRESS)->get()->take(4);

    return $newProjects;

}

Мой контроллер:

public function more ()
{
    $data = Project::collectNewProjects();
    return response()->json($data);
}

Когда я нажимаю на кнопку, я хочу получить следующие 4 записи

Мой маршрут:

Route::get('more', 'IndexPageController@more');

Ajax:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
    $(".clickMe").click(function(){
        $.ajax({
            dataType: 'json',
            type:'GET',
            url: "{{ url('more') }}",
        }).done(function(data){
            var len=data.length
            console.log(len);
            //Perform ANy action after successfuly post data
            var rows = '';
            for(i=0;i<data.length;i++){
                rows = rows + 'data[i].url'
            }
            $("#morePosts").html(rows);
        })
</script>

blade.php

<div class="b-preview-container" id="take_height">


@include('projects.main_index', [
         'categories'=>$categories,
         'hotProjects'=>$hotProjects ,
         'countProjects' =>$countProjects,
         'newProjects'=>$newProjects
])

</div>
<button type="submit" class="clickMe">Show More</button>
<div id="morePosts"></div>

и main_index.blade.php

<div class="value">
        @foreach($newProjects as $project)
            {{$project->name}}
        @endforeach
</div>

Ранее я не работал с Ajax,поэтому я не понимаю, где я допустил ошибку.