How to change the color of links with the user’s click?

Question

Hello! Well, I have a Topbar on my mini search site: http://isearch.baloon.url.ph, And now I’ve got a Javascript form action exchange system, which switches between "web, images, videos and news". However, the link "Web" is already selected (blue color), but I wanted when the user clicked on the other links, the clicked blue color and the others black color, highlighting the choice of research done. Thus follows the example of Babylon Search: http://search.babylon.com, that when we click on images, videos and news, the chosen option is highlighted.

Answer 1

var links = document.querySelectorAll('ul.tabs-title li');

function ativar() {
    for (var i = 0; i < links.length; i++) {
        links[i].classList.remove('current');
    }
    this.classList.add('current');
}

for (var i = 0; i < links.length; i++) {
    links[i].addEventListener('click', ativar);
}

Example: http://jsfiddle.net/62y1mvL9/

So this idea is divided into three parts:

• select all the elements to click

• define a function that executes in the click

And here in this function all the <li> to remove the class current and then add only that on, which clicked.

• add the event receiver calling the function ativar when the element li receive a click

---

I used HTML in the link you put in the question.