JQuery javascript search filter not updating clearing value

I have the following javscript code which filters a table based on search criteria in the SearchInput field. I then added a clear button called clearSearch which is designed to empty the search field. It works to a certain extent until I clear what I type in the search which sets value of the search field as blank but at this point the search doesn’t update.

Any ideas how I can make the search reflect the clearing function?

Thanks

$(document).ready(function(){

  $("#SearchInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $("#Data tr").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });

  $("#clearSearch").click(function(){
  $("#SearchInput").val("");
  });

});

You need to sign in to view this answers