How do I assign class="active" to a link element when another link is clicked?
i.e I have:
<div id="wrap">
<a href="one.php"></a>
<a href="two.php"></a>
<a href="three.php"></a>
</div>
<a href="one.php"></a>
<a href="two.php"></a>
<a href="three.php"></a>
But when the the link for one.php is clicked below, I want the link in the div wrap above to have the active class, as so:
<div id="wrap">
<a href="one.php" class="active"></a>
<a href="two.php"></a>
<a href="three.php"></a>
</div>
<a href="one.php"></a>
<a href="two.php"></a>
<a href="three.php"></a>
Basically I was thinking something like:
var foo = $(this).attr("href");
if ($(this).attr("href") == "hello.php")
$("#wrap").//something else
Add a click event listener to every anchor element that adds the active class to every anchor, then removes the active class on the anchor element clicked.
$('a').click(function(){
$('a').addClass('active');
$(this).removeClass('active');
}).active{
background-color: yellow;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#">link 1</a>
<a href="#">link 2</a>