Struggling to implement search/filter functionality with paginated list items (using jQuery)

While working on the List Pagination/Filtering project for the Full Stack JavaScript TechDegree, I've ran into some issues with the search bar.

The functions I've wrote to paginate the list items work well, however I'm struggling with implementing the search/filter functionality. Here's the code I've written for the search:

let searchBar = document.createElement('div.student-search');
let searchField = document.createElement('input');
$(searchField).attr('placeholder', 'Search for students...');
let searchButton = document.createElement('button');
$(searchButton).append('Search');

$('div.page-header').append(searchBar);
$(searchBar).append(searchField);
$(searchBar).append(searchButton);

// Variables for search functionality
let $filter = $(searchField).val().toLowerCase();
let $names = $($fullList).children('h3');

$(searchBar).on('keyup', (event) => {
    $($names).filter(() => {
        $(this).toggle($(this).text().toLowerCase().indexOf($filter) > -1);
    });
});

Adding this code to my website has no affect at all on the list items, how they paginate, or anything else on the website besides the search bar element being added to the page.

I think it may be related to a very odd error I'm receiving because of how I am showing and hiding the students. Here's how I'm doing that:

function showPage(list, page){
    for(var i = 0; i <= list.length; i+= 1){
        let currentStudent = list[i];
        let studentMin = page * 10;
        let studentMax = studentMin + 9;

        // Arrays for jQuery targets
        let showList = [];
        let hideList = [];

        if(i >= studentMin && i <= studentMax){
            showList.push(currentStudent);
        }else{
            hideList.push(currentStudent);
        }

        // adding hide to the old students and fading in the new students
        $(hideList).hide();
        $(showList).fadeIn();
    }
}

At the line containing .hide(); I am getting this error:

jQuery.Deferred exception: Cannot read property 'style' of undefined TypeError: Cannot read property 'style' of undefined

On whichever line of code I place the parent function that calls the showPage function, every line after that will not run. For example when I placed the parent function before my code to implement the search bar, the code wouldn't even create the variables or add the elements, but if I place the parent function at the end of everything, it runs, but isn't functional.

When I submitted this for review, the reviewer said the error is related to how I am looping through the array of students with the .hide() and .fadeIn() functions.

The search/filter functionality is my primary focus, so unless the error is interfering with that, I am not very concerned about it.

Thanks for any and all help!