onFocus does not remove value input text box

Question

If I use this: <input class="search" type="text" id="input" onfocus="this.value=''" /> and I write for example: arduino and it searches for everything with the text arduino and after that I click on somewhere else on the webpage and then click on the input field again, the text clears out as it should, but I have to backspace once on my keyboard, to clear the results for arduino and show everything.

Why and how can I fix this? Thanks

jsfiddle code here

Answer 1

Trigger the keyup handler onfocus:

http://jsfiddle.net/dErda/1/

$('#input').on('focus',function(){
        this.value='';
        $(this).keyup();
    });

Answer 2

Try this to clear search and show everything back:

$("input[type=text]").focus(function(){
  $(this).val('');    
    $('.input').hide();
     $("ul.filter li").show();
});