Classlist add not working, link is not disappearing

So i need a link to appear when i click on another link and the clicked link needs to disappear i do this through class list by adding css class to display none but it doesn’t
work i dont know why im not a master to js so please forgive me if any stupid mistakes are their

JS:

var link = document.querySelector(‘a’);
var lang = document.querySelector(‘lang’);
var content = document.querySelector(‘.content’)

link.forEach( el => {
el.addEventListener(‘click’, () => {

lang.querySelector(‘.active’).classList.add(‘active’);
el.classList.remove(‘active’);
});
});
var data = {
“english”:{
“hi” : “welcome”,
“Lang”:”EN”
},
“arabic”:{
“hi” : “منزل”,
“Lang”:”AR”
}
}

here’s the HTML that matters
HTML:

<nav class=”navbar”>
<div class=”logo”><a href=”#”><img src=”images/nav-logo.png” alt=”Logo” height=”70px”></a></div>
<ul class=”nav-items”>
<li><a href=”#”>Menu</a></li>
<li><a href=”#”>Locations</a></li>
<li><a href=”#”>Contact</a></li>
<li class=”lang active” id=”eng”><a href=”#” class=”lang-link” language=”english”>EN</a></li>
<li class=”lang” id=”ar”><a href=”#” class=”lang-link” language=”arabic”>AR</a></li>

</ul>
</nav> “`
And css

nav ul .active{
display: none;
}“`