I'm looking to filter a list of objects in a JSON array when an HTML checkbox is clicked. I know about the JavaScript array.sort() method but how do I eliminate items based on checkbox clicks? Do I need an event listener?

My JSON looks as so:

```
{ "lots" : [
    {
    "name" : "Parking Lot Name",
    "price" : 2,
    "cash" : true,
    "credit" : false,
    "address" : "1234 W Main Ave",
    "center" : {
        "lat" : 67.659414,
        "lng" : -137.414730
    }... etc.

```

So if I've got a form that includes checkboxes for eliminating parking lots based on payment type, how should I go about implementing that? I've read about a jQuery array.grep() function, is that it?

My page is being built using a JS loop like this:

```
makeList(){
var self = this;

self.jsonFile = $.ajax({
 type: 'GET',
 url: 'assets/data/default.json',
 dataType: 'json',
 success: function(response) {
   console.log(response);
 }
});

self.jsonFile.done(function(data){
  //Sort low to high by default
  data.lots.sort(function(a, b){
    return(a.price > b.price)
  });

  for (var i = 0; i < data.lots.length; i++) {
    document.getElementById('jsonList').innerHTML +=
      '<li>
        <div id="text">
          <p class="price"> 
            $' + data.lots[i].price +  '.00
          </p>
          <p class="info">' +
            data.lots[i].address +
         '</p>
        </div>
        <form method="get">
          <button type="submit" formaction="https://www.google.com/maps/dir/Current+Location/' +
           data.lots[i].address +
           '">Directions
          </button>
          <button type="submit" formaction="detail-view.html">Details
          </button>
        </form>
      </li>';
  }
});

```

}