Search and display div onkeyup search

Question

I want to create a simple search jquery. Where divs containing the keywords are displayed when key matches and divs that does not match are hidden. I also want all divs to display back then content in the search field is erased. I am not a jquery guru, im still a learner. I have gone through this post but i can not get the divs to display back when the field is empty Javascript search and display divs with matching keywords

Here is my code below

$(document).ready(function() {
  $('#search').keyup(function() {
    var val = $(this).val().tolowerCase();
    $(".dosearch").hide();
    $(".dosearch").each(function() {
      var text = $(this).text().tolowerCase();
      if (text.indexOf(val) != -1) {
        $(this).show();
      }
    })
  })
})

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

<input type="text" id="search" />

<div class="dosearch">Dele</div>
<div class="dosearch">Ife</div>
<div class="dosearch">Olusola</div>
<div class="dosearch">Lojik</div>
<div class="dosearch">Hazik</div>
<div class="dosearch">Tinuke</div>
<div class="dosearch">Asabi</div>
<div class="dosearch">Bukewami</div>
<div class="dosearch">Obesere</div>
<div class="dosearch">Osupa</div>