<div class="container">
  <div class="search">
    <input type="text" id="myInput" placeholder="Поиск">
  </div>
  <ul id="myList">
    <li>Ivan</li>
    <li>Olga</li>
    <li>Stew</li>
    <li>Jeanne</li>
    <li>Ekaterina</li>
    <li>Daria</li>
  </ul>
</div>

html {
  width: 100%;
  height: 100%;
}

body {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font: 20px/28px 'Verdana'
}

.container {
  width: 80%;
  
  .search {
    width: 100%;
    margin-bottom: 12px;
    
    input {
      font: 16px/16px 'Verdana';
      width: 100%;
      box-sizing: border-box;
      border: 1px solid #ccc;
      border-radius: 4px;
      padding: 12px 20px;
      outline: none;
      
      &:focus {
        border-color: #4b99f2;
      }
    }
  }
  
  ul {
    list-style: none;
    padding: 0;
    
    li {
      border-bottom: 1px solid #ccc;
      padding: 0 20px 12px;
      margin-bottom: 12px;
      
      &:last-child {
        padding-bottom: 0;
        margin-bottom: 0;
        border: 0;
      }
    }
  }
}

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