Есть сайт, у которого в меню есть пункт с выпадающими элементами. Но в мобильной версии нет надобности прятать дочерние элементы в подменю - можно показывать в одном уровне с другими пунктами. Посему стоит вопрос о том, как правильно убрать вложенность списка для мобильной версии.
Можно было б продублировать пункт меню с вложенными элементами и с помощью css один показывать в обычной версии, а в мобильной его прятать и наборот - показывать прежде скрытые. Но так по коду, получается, будет дубляж, не совсем элегантное решение. Возможно, есть вариант как можно другим способом при просмотре с мобильного устройства из такого вида
<li>пункт </li>
<li>пункт</li>
<li>пункт
<ul id="submenu">
<li>подпункт</li>
<li>подпункт</li>
<li>подпункт</li>
</ul>
</li>
<li>пункт</li>
можно получить
<li>пункт </li>
<li>пункт</li>
<li>пункт</li>
<li>подпункт</li>
<li>подпункт</li>
<li>подпункт</li>
<li>пункт</li>