<ul class="list">
  <li id="item1"> text 1 </li>
  <li id="item2"> text 2 </li>
  <li id="item3"> text 3 </li>
</ul>
<div class="links">
  <a href="#item1"> add class to text 1 </a>
  <a href="#item2"> add class to text 2 </a>
  <a href="#item3"> add class to text 3 </a>
</div>
<div id="result">
  
</div>

.list li.active {
  color: red;
}
.links a {
  display: block;
}

Array.from(document.querySelectorAll('.links a')).forEach((el,idx) => {
  el.addEventListener('click', function(e) {
    e.preventDefault();
    let li_item = document.querySelector(this.getAttribute('href'));           li_item.classList.add('active');
    for (let sibling of li_item.parentNode.children) {
        if (sibling !== li_item) { sibling.classList.remove('active'); }
    }   
  });
});