JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="top">
    <li>
        <a href="http://yandex.ru" class="prevent">Yandex.ru</a>
        <ul class="sub">
            <li>1111</li>
        </ul>
    </li>
    <li>
        <a href="http://yandex.ru" class="prevent">Yandex.ru</a>
        <ul class="sub">
            <li>222</li>
        </ul>
    </li>
    <li>
        <a href="http://yandex.ru" class="prevent">Yandex.ru</a>
        <ul class="sub">
        </ul>
    </li>
</ul>

CSS

.sub {
    display: none;
}

JavaScript

$(document).on("click", ".prevent", function(e) {
    if (e.metaKey || e.ctrlKey || e.altKey || e.shiftKey) {
        return true;
    }
    
    var hasSubmenu = $(this).siblings(".sub").children().length;
    
    if (hasSubmenu) {
	    e.preventDefault();
    }
});