$(".subDepth > li > a").click(function() {
$(this).parents().closest("a").addClass('active');
});#gnb > li > a.active { color: red; }<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul id="gnb">
<li class="gnb1"><a href="#">Menuname</a>
<ul class="subDepth">
<li><a href="01.html">sublist01</a></li>
<li><a href="02.html">sublist02</a></li>
<li><a href="03.html">sublist03</a></li>
<li><a href="04.html">sublist04</a></li>
<li><a href="05.html">sublist05</a></li>
</ul>
</li>
</ul>This is my work. Adding an active class does not work. Maybe I used the wrong code to find the parents. Please help me. I want to make this : when I click the .subDepth , then change the font-color of the .gnb1
If you want to apply the active class on the link clicked. Then you can use the below logic:
$('.subDepth li a').click(function(){
$('li a').removeClass("active");
$(this).addClass("active");
});
And use .active class as follows:
.active{
color:red;
}