I am try to iterate through all `li` elements in `ul` on `keydown` event by firing `focus()` event for next sibling `li`. In this process, I dont want to focus out from parent `ul`. 
But its not happening. Even changing focus on siblings is causing focusout event on parent. I want that only when someone clicks somewhere else on the screen should focus out of parent be fired.

```js
var KEY_DOWN=40;

$(document).on('keydown', 'li', function(e){
 let keyCode = e.keyCode || e.which;
 if(keyCode == KEY_DOWN)
 {
  if($(this).next().length != 0)
  {
   $(this).next().focus();
  }
  else
  {
   $(this).parent().children().first().focus();
  }
  return false;
 }
});

$(document).on('focusout','ul', function(e)
{
 console.log('focused')
});
```

```css
li
{
  border: 1px solid black;
}

li:focus
{
  background: #999;
}
```

```html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul tabindex="-1">
<li tabindex="-1">First</li>
<li tabindex="-1">Second</li>
<li tabindex="-1">Third</li>
</ul>
```

In the snippet, focused in getting printed on every down key press. How to solve this situation.