Capturing ‘Lost focus’ or ‘blur’ event for div, li or other non-input elements in Jquery

I was working on ‘ul-li’ structure in which I wanted to 

1. show 2^nd li when 1^st li is focused and 
2. hide it when 1^st lose focus. 

I tried with ‘focus’ and ‘blur’ events, but ‘blur’ event was not being called for li element. Searching for answer on internet, I came to know that blur or lost focus event is fired when it’s an input element!

So I went for a work around that uses ‘mouseenter’ and ‘mouseleave’ events for ‘focus’ and ‘blur’ events respectively. This events can be used for ‘li’, ‘a’ as well as ‘div’ elements. IE7, 8, 9, Chrome and Firefox support these events. Below is the code that I have used.

$("#myFirstLiElement").mouseenter(function () {
              $("#mySecondLiElement").show();
       }).mouseleave(function () {      
              $("#mySecondLiElement").hide();
 });