Выбор родителя ребенка в CSS

С помощью приведенного ниже кода я хочу иметь возможность применить стиль CSS к родителюli class="parent" пункт в списке. Но только когда пользователь наводит курсор на ребенкаli class="child" предметы для этого конкретного родителя.

Насколько я понимаю, это будет невозможно с использованием только CSS, но кто-нибудь знает о потенциальном решении Javascript (в идеале, с использованием jQuery, так как мы уже используем эту библиотеку на нашем сайте)

Спасибо!

<ul>
    <li class="parent"><a href="URL" >Main Link</a>
         <ul class="sub-menu">
             <li class="child"><a href="URL" >Link</a></li>
         </ul>
    </li>
</ul>