jQuery .hide() & .show()

Right now I have an application where I am pulling items from a SharePoint list, posting them to an HTML list so that it may be printed. Right now, I have it to where nothing shows up on page load which is perfect, but once the user searches for results based on a date I have a query where only those corresponded with that date appear. But as of now, after the user enters a date(input search formatted YYYY-MM-DD), nothing happens. I tried to utilize .show() & .hide() jQuery effects, but I am only have luck with the .show() effect.

Here is a working Fiddle with static data: https://jsfiddle.net/d7cu38jv/1/ (by working I mean functionality and data posting)

Here is my snippet using dynamic data from a fetch (this is what I am actually using):

  .then((results) => {
      let data = results;
      var listContent = '';
      console.log(data);
    for (var i = 0; i < data.length; i++) {
        var currData = data[i];
        listContent += '<li class="test" data-weekOf="'+currData.WeekOf.split("T")[0]+'">';
        console.log(currData.WeekOf.split("T")[0]);
       if(currData.Team !== null){
        listContent += '<h2>' + currData.Team.results.join(', ') +'</h2>';
        }else{
        listContent += '<h2>' + "Null" +'</h2>';
        }
       if(currData.MajorTasks !== null){
        listContent += '<h4> Major Tasks Completed </h4>';
        listContent += '<ul class="black">' + "- " + currData.MajorTasks.replace(/(<([^>]+)>)/gi, " ") + '</ul>';
       }else{
       }
       if(currData.DeliverablesSubmitted !== null){
        listContent += '<h4> Deliverables Submitted</h4>';
        listContent += '<ul class="black">' + "- " + currData.DeliverablesSubmitted.replace(/(<([^>]+)>)/gi, " ") + '</ul>';
       }else{
       }
       if(currData.UpcomingTasks !== null){
        listContent += '<h4> Upcoming Tasks</h4>';
        listContent += '<ul class="black">' + "- " + currData.UpcomingTasks.replace(/(<([^>]+)>)/gi, " ") + '</ul>';
       }else{
       }
       if(currData.UpcomingDeliverables !== null){
        listContent += '<h4> Upcoming Deliverables</h4>';
        listContent += '<ul class="black">' + "- " + currData.UpcomingDeliverables.replace(/(<([^>]+)>)/gi, "</br> -") + '</ul>';
       }else{
       }
       if(currData.PersonnelActions !== null){
        listContent += '<h4> Personnel Actions </h4>';
        listContent += '<ul class="black">' + "- " + currData.PersonnelActions.replace(/(<([^>]+)>)/gi, " ") + '</ul>';
       }else{
       }
       if(currData.Upcoming !== null){
        listContent += '<h4> Upcoming G3G Events </h4>';
        listContent += '<ul class="black">' + "- " + currData.Upcoming.replace(/(<([^>]+)>)/gi, " ") + '</ul>';
       }else{
       }
       listContent += '</li>';
    }
 $('#report-summary').html(listContent);
 $('#under_txt').text(' ');
});
$(document).ready(function(){
  $('#report-summary').hide();
  $("#myInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $('#under_txt').text(value);
    if (value == "") {
      $("li.test").fadeIn();
    } else {
      $('li.test').fadeOut(10);
      $('[data-weekof=' + value + ']').fadeIn();
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link type="text/css" media="all" rel="stylesheet">
<div class="container">
  
    <div id="search">
    <input id="myInput" type="text"/>
  </div>
  <div class="printbtn">
    <a class="printPage" href="#">Print Report</a>
  </div>
 
  <h1>Weekly Manager Report</h1>
  <p class="black">Week Of:<span id="under_txt"></span></p>
  <div id="report-summary"></div>
</div>