How to Repopulate loop with new list using jquery

How to Repopulate loop with new list using jquery

I am working on a site which has a bunch of profiles of people, on the side is a checkbox which the user can click to refine the search to only show profiles that meet certain criteria. 

To do this I made an ajax call to get a new list, but I can't figure out how t erase the old list and reload the new list.

Here is the html of the loop

 @foreach(Cleaner c in Model)
                    { 
                    <div class="col-sm-4 col-lg-4 col-md-4">

                        <div class="card hovercard">
                            <div class="cardheader">

                            </div>
                            <div class="avatar">
                                <img alt="" src="/Uploads/@c.Picture">
                            </div>
                            <div class="info">
                                <div class="title">
                                    <a target="_blank" href=" http://localhost:53008/authentication/profileperson?id=@c.id">@c.FirstName @c.LastName</a>
                                </div>
                                <div class="desc">Age: @c.Age</div>
                                <div class="desc">Family Rav: @c.Address</div>
                            </div>
                        </div>

                    </div>
                    }
                </div>

Here is the ajax

$(function () {
    $('input[type=checkbox]').change(
     function () {
         if (this.checked) {
             $.post("/Authentication/GetCleanersThatHaveOwnTransportation", {}, function (cleaners) {
             

             });
         }
     });
});

Any suggestions?