Привет , есть простая задача на 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