Jquery display a message when toggle is false

I am using jquery toggle to show/hide some items and need to display a message when the item is not found. My code below does the toggle hide but I want to show a message when there is nothing to toggle.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

const userSearch = ($("#userId").val() || '').toLowerCase();

$('.table tbody tr').find("dl dd").each(function() {
  const userfilter = $(this);
  const userNames = userfilter[0].innerText.toLowerCase();
  const index = userNames.substring(userNames.indexOf(userSearch));
  $(this).toggle(index === userSearch);
});

<!-- end snippet -->

Check the condition explicitly in an if statement, so you can set a variable to indicate whether you found a match.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

const userSearch = $("#userId").val().toLowerCase();

let foundMatch = false;
$('.table tbody tr').find("dl dd").each(function() {
  if (this.innerText.toLowerCase().includes(userSearch)) {
    $(this).show();
    foundMatch = true;
  } else {
    $(this).hide();
  }
});

if (!foundMatch) {
  // display message
}

<!-- end snippet -->

There's no need for || '' when setting userSearch. .val() always returns a string (unless the selector doesn't match anything, which shouldn't happen).

I think you want to just check the length of the items and if it is not greater than zero, show a message.

Try this

const userSearch = ($("#userId").val() || '').toLowerCase();
if(!($('.table tbody tr').find("dl dd").length > 0)) {
  alert('no dd elements');
} else {
  $('.table tbody tr').find("dl dd").each(function() {
    const userfilter = $(this);
    const userNames = userfilter[0].innerText.toLowerCase();
    const index = userNames.substring(userNames.indexOf(userSearch));
    $(this).toggle(index === userSearch);
  });
}