Есть чистый js, помогите пожалуйста перевести в jquery и подскажите как можно упростить появление исчезновение контейнера? сейчас делается путем наслоения, но неудобно использовать какие-то конкретные классы ксс для субменю, уж очень громоздкое js получается, как это реализовать на $(this)? без указания уникального класса субменю, пытался реализовать с помощью toggle, но ничего не получилось(
<script>
const drop_btn = document.querySelector(".drop-btn .drop-meka");
const tooltip = document.querySelector(".tooltip");
const menu_wrapper = document.querySelector(".wrapper");
const menu_bar = document.querySelector(".menu-bar");
const setting_drop = document.querySelector(".setting-drop");
const help_drop = document.querySelector(".help-drop");
const setting_item = document.querySelector(".setting-item");
const help_item = document.querySelector(".help-item");
const setting_btn = document.querySelector(".back-setting-btn");
const help_btn = document.querySelector(".back-help-btn");
drop_btn.onclick = (()=>{
menu_wrapper.classList.toggle("show");
tooltip.classList.toggle("show");
});
setting_item.onclick = (()=>{
menu_bar.style.display = "none";
setTimeout(()=>{
setting_drop.style.display = "block";
}, 100);
});
help_item.onclick = (()=>{
menu_bar.style.display = "none";
setTimeout(()=>{
help_drop.style.display = "block";
}, 100);
});
setting_btn.onclick = (()=>{
menu_bar.style.display = "block";
setting_drop.style.display = "none";
});
help_btn.onclick = (()=>{
help_drop.style.display = "none";
menu_bar.style.display = "block";
});
</script>