Простая задачка на js?

Question

[DeniSidorenko]

Привет , есть простая задача на JS, у меня есть такая структура

<ul>
<li>
<a href='#'> Course 1 </a>
<ul class='submenu'> 
SUBMENu
</ul>
</li>
<li>
<a href='#'> Course 2 </a>
<ul class='submenu'> 
SUBMENu
</ul>
</li>
</ul>

Так же для a задан стили, при фокусировке менять цвет( ну это неважно) . Так вот по аналогии с CSS надо сделать и JS. Если на css я нажимаю и элемент становиться фокусированным ( т.е меняется цвет()) а если кликаю по другому элементу, или в другую часть экрана он не становиться фокусированным (a:focus). Как сделать что бы на JS, для фокусированного элемента его submenu получать display block, а если сылки убирается фокус submenu получается display none
Я знаю как плохо объяснил но очень надеюсь что поймет
КРАТКО:
Есть li в котором есть a + ul.submenu. Как сделать что бы когда a:focus, submenu получал display block, если убрать фокусировку, при клике на другой элемент или другое места, submenu получает display: none

Comments

[Манучехр Жалолов]

https://developer.mozilla.org/en-US/docs/Web/Events

Answer 1

[Andrew]

$('ul>li').focus(function() {
$(this).find('.submenu').show();
});

.submenu{
display:none;
}

"Главному" ul еще класс дайте какой-то, а-то все ul будут при фокусе показывать свои .submenu, которых может не быть

Comments

[BATPYIIIKOB]

Далее переписываешь на JS youmightnotneedjquery.com

[Andrew]

Евгений Прозоров, зачем? вброс ради вброса?
"jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application"

[BATPYIIIKOB]

Andrew, ну так то вопрос: Простая задачка на js? Прекрасно понимаю, что jQ и есть JS, но не обратно. Возможно у человека именно стоит задача реализации на JS