JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li class="selected1">
      <a class="trigger" href="">Trigger</a><br />
      <a href="">Not trigger</a>
      <ul>
        <li class="selected">
          <a class="trigger" href="">Trigger</a><br /> 
          <a href="" id = "my_target">Click me</a>
          <ul>
            <li class="selected">
              <a class="trigger" href="">Trigger</a><br /> 
              <a href="" id = "my_target1">Click me</a>
            </li>
          </ul>
        </li>
      </ul>
    </li>
  </ul>

CSS

ul { list-style-type: disc; padding-left: 10px;}
li { padding-left: 10px; }

.triggerClass { color: #f00; }

JavaScript

$(document).ready( function() {
    $('#my_target1').click( function(e) {
       $(".selected1").chidren('li').each() $(this).parents('li.selected').children('a.trigger').css('color', '#ff0000');
        e.preventDefault();
    });
});