$(".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>
Este es mi trabajo. Agregar una clase activa no funciona. Tal vez usé el código incorrecto para encontrar a los padres. Por favor, ayúdame. Quiero hacer esto: cuando hago clic en .subDepth, luego cambio el color de fuente de .gnb1
Si desea aplicar la clase active
en el enlace hizo clic. Entonces puedes usar la siguiente lógica:
$('.subDepth li a').click(function(){ $('li a').removeClass("active"); $(this).addClass("active"); });
Y use la clase .active
de la siguiente manera:
.active{ color:red; }