JSFiddle - React, Tailwind, and code Playground
JavaScript
var filtered = [];
$('#footballCheck').on('change', function() {
if ($('#footballCheck').is(':checked')) {
for (var i = 0; i < fa_names.length; i++) {
if (fa_names[i]["facility_activity"].toLowerCase().indexOf("football") >= 0) {
filtered.push(fa_names[i]);
}
}
filtered.sort(SortByName);
$('#mCSB_1_container').empty(".facility-name");
for (var k = 0; k < filtered.length; k++) {
$('#mCSB_1_container').append('<div class="row facility-name">\
<button class="btn btn-default btn-fill btn-menu" date-name="' + filtered[k]["facility_name"] + '">' + filtered[k]["facility_name"] + '</button></div>');
$('#facilities-body').mCustomScrollbar("update");
}
} else {
for (var j = 0; j < filtered.length; j++) {
if (filtered[j]["facility_activity"].toLowerCase().indexOf("football") >= 0) {
delete filtered[j];
}
}
console.log(filtered);
console.log(filtered.length);
if (filtered.length > 0) {
filtered.sort(SortByName);
$('#mCSB_1_container').empty(".facility-name");
for (var k = 0; k < filtered.length; k++) {
$('#mCSB_1_container').append('<div class="row facility-name">\
<button class="btn btn-default btn-fill btn-menu" date-name="' + filtered[k]["facility_name"] + '">' + filtered[k]["facility_name"] + '</button></div>');
$('#facilities-body').mCustomScrollbar("update");
}
} else {
$('#mCSB_1_container').empty(".facility-name");
for (k = 0; k < fa_names.length; k++) {
$('#mCSB_1_container').append('<div class="row facility-name">\
<button class="btn btn-default btn-fill btn-menu" date-name="' + fa_names[k]["facility_name"] + '">' + fa_names[k]["facility_name"] + '</button></div>');
$('#facilities-body').mCustomScrollbar("update");
}
}
}
});