On the platform I'm using, users can adjust element settings with CSS. I'm attempting to make the "a" element change color when hovering over the "li" element. However, the color of the "a" element isn't changing as expected. How can I resolve this issue? I understand that I can change the "a" element's color upon hover, but my goal is to have it change color while hovering over the "li" element.
<div class="top">
<ul class="menu">
<li><a>Home</a></li>
<li>Products
<ul class="submenu">
<li><a>T-Shirts</a></li>
<li><a>Shirts</a></li>
<li><a>Tank Tops</a></li>
</ul>
</li>
</ul>
</div>
.submenu li{
background-color:#262626;
color:white;
}
.submenu li:hover{
background-color:white;
color:#262626;
}
Thank you in advance for your help.