I am trying to convert data from ajax response in HTML mostly I read articles everyone does code HTML in controller where i am confused that we should not write any kind of HTML in controller. i wrote the HTML in controller but not satisfied with this kind of programming. How can I get the response and what formate so i can code that response in HTML either received in JSON or anything else.
In view m showing the list of manufactures. Any better way clean way to not to write HTML in controller

View

```

    <div class="pl-md-4 pl-2">
        {{count($leedManufacturers)}}
        <label class=" my-checkbox gry2">Show All Manufacturers
            <input type="checkbox">
            <span class="checkmark"></span>
        </label>
        @if(count($leedManufacturers) > 0 )

        @foreach($leedManufacturers as $leedsManufacturer)
        {{-- @foreach($leedManufacturers as $leedsManufacturer)  --}}
            <div class="post" id="post{{$leedsManufacturer['id']}}">
                <label class=" my-checkbox gry2" id="manufacturer">{{str_limit($leedsManufacturer['name'], 300)}}
                        <input type="checkbox">
                        <span class="checkmark"></span>
                </label>
            </div>
            {{-- for load more script --}}
        {{-- <input type="hidden" id="row" value="0"> --}}

        {{-- <input type="hidden" id="all" value="{{$total_manufacturers}}"> --}}
        @endforeach

        @endif

        <button class="load-more" id="load" class="f-14 bold">See All</button>

        <input type="hidden" id="row" value="0">
        <input type="hidden" id="all" value="{{count($leedManufacturers)}}">

    </div>

```

Script

```
<script type="text/javascript">

        // $.ajaxSetup({ headers: { 'csrftoken' : '{{ csrf_token() }}' } });
            $(document).ready(function(){

            // Load more data
            $('.load-more').click(function(){
                var row = Number($('#row').val());
                var allcount = Number($('#all').val());
                var rowperpage = 3;
                // row = row + rowperpage;
                row = row + 3;

                if(row <= allcount){
                    $("#row").val(row);

                    $.ajax({
                    // url: "{{ route('ajax') }}",
                    url: "{{ url('ajax') }}",
                    type: 'post',

                    headers: {
                        'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
                    },
                    data: {row:row},

                    // error: function(XMLHttpRequest, textStatus, errorThrown) {
                    //     alert('hi');
                    // }

                    success: function(response){

                    // Setting little delay while displaying new content
                    setTimeout(function() {
                        // appending posts after last post with class="post"
                        $(".post").after(response).show().fadeIn("slow");

                        var rowno = row + 3;

                        // checking row value is greater than allcount or not
                        if(rowno > allcount){

                            // Change the text and background
                            $('.load-more').text("show less");
                            $('.load-more').css("background","darkorchid");
                        }else{
                            $(".load-more").text("Load more");
                        }
                    }, 2000);
                    }
 });

                }else{
            $('.load-more').text("Loading...");

            // Setting little delay while removing contents
            setTimeout(function() {

                // When row is greater than allcount then remove all class='post' element after 3 element
                $('.post:nth-child(3)').nextAll('.post').remove().fadeIn("slow");

                // Reset the value of row
                $("#row").val(0);

                // Change the text and background
                $('.load-more').text("Load more");
                $('.load-more').css("background","#15a9ce");

            }, 2000);
        }
            });

            });
    </script>

```

Controller:

```
public function ajax(Request $request){ 

    $data['products'] = Product::select('products.id', 'products.name', 'products.banner')->get();

    $html = '';

    foreach ($data['products'] as $product){

        $html .= '<div class="post" id="">';
        $html .= '<label class=" my-checkbox gry2" id="manufacturer">'.$product->name.'';
        $html .= '<input type="checkbox">';
        $html .= '<span class="checkmark"></span>';
        $html .= '</label>';
        $html .= '</div>';  
    }
    echo $html;
}

```