Make Number Change In Descending Order

Question

I want to create an automatic counter, which is marked in what number is every second.

In order for that to happen, I have in mind that he must jump from one element <a> to another every second.

I’m running tests manually, then programming the auto-countdown.

The whole logic is simple, with each click a descent to a previous number

Code

el = document.getElementsByTagName('a')

var x = 0, y = 0;

function voltar()
{
if(y == 6 || x == 0) 
alert("Limite!");
else {
el[x].style.color = "red";
el[y].style.color = "black";
}
x--;
}

a
{ 
text-decoration: none;

cursor: pointer;

padding: 3px; 

color: black; 
}

<a onclick="voltar(x--)" id="menos">Você está no:</a>

<a>1</a>
<a>2</a>
<a>3</a>
<a>4</a>
<a style="color:red">5</a>

Every click in the word You’re in the: then he should go down to the minor number/predecessor

NOTE - the previous color should be restored, leaving in red color only the number highlighted.

Answer 1

I made some changes with your snippet. Make sure that’s what you want.

el = document.getElementsByTagName('a')

var x = 0;

function voltar(limit)
{
  
  if(x == 0) x = limit;

for(var i = 0; i < el.length; i++){
  el[i].className = "";
}
  el[x].className = "color";
  
  x--;

}

a
{ 
text-decoration: none;

cursor: pointer;

padding: 3px; 

color: black; 
}

.color {
  color:red;
  }

<a onclick="voltar(5)" id="menos">Você está no:</a>


<a>1</a>
<a>2</a>
<a>3</a>
<a>4</a>
<a class="red">5</a>