Как выделить данный пункт, чтоб открывал не все пункты стразу а только выбранный?

Question

[Вадим Свердлик]

<li class="main-menu__item">
			<a class="main-menu__link" target="" href="http://localhost:8888/NCA/category/obshhestvo/">Общество</a>
			<svg class="main-menu__svg" width="9" height="6" viewBox="0 0 9 6" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M0.954102 0.826172L4.65962 4.53175L8.36519 0.826172"></path>
			</svg>
			<ul class="submenu" style="display: none;">
									<li class="submenu__item">
						<a class="submenu__link" href="http://localhost:8888/NCA/category/obshhestvo/kriminal/">Криминал</a>
					</li>
									<li class="submenu__item">
						<a class="submenu__link" href="http://localhost:8888/NCA/category/obshhestvo/obshhestvo-srednyaya-aziya-mir/">Общество (Средняя Азия, мир)</a>
					</li>
									<li class="submenu__item">
						<a class="submenu__link" href="http://localhost:8888/NCA/category/obshhestvo/proisshestviya/">Происшествия</a>
					</li>
									<li class="submenu__item">
						<a class="submenu__link" href="http://localhost:8888/NCA/category/obshhestvo/sport/">Спорт</a>
					</li>
							</ul>
		</li>

var popupLink = $('.main-menu__svg');
var rulesPop = $('.submenu');
popupLink.mouseenter(function() {
rulesPop.show();
});

rulesPop.mouseleave(function() {
rulesPop.hide();
});

этот скрипт срабатывает но на все пункты сразу, как сделать, чтоб выбрало только текущий?

Comments

[Ankhena]

$(this).next(".submenu").show();

[Вадим Свердлик]

Ankhena, простите, у меня не работает

[Ankhena]

Вадим Свердлик, по вашей логике так: https://jsfiddle.net/6j3oxmnp/

[Вадим Свердлик]

Ankhena, спасибо