Как сделать, чтобы не было рандома, и цвет менялся в одном порядке красный — синий и обратно?

Question

[BGpro]

const button = document.getElementById("btn");
const color = document.querySelector("#back");

const colors = ["#ff4242", "#004fd3",]


button.addEventListener("click", () => {
	let hexColor = colors[getColorNumber()];
	document.body.style.backgroundColor = hexColor;
	color.style.backgroundColor = hexColor;
});

function getColorNumber() {
	return Math.floor(Math.random() * colors.length);
}

Answer 1

[Сергей delphinpro]

const colors = ["#ff4242", "#004fd3",]
let index = 0;

button.addEventListener("click", () => {
  const hexColor = colors[Math.abs(--index)];
  document.body.style.backgroundColor = hexColor;
  color.style.backgroundColor = hexColor;
});

Comments

[BGpro]

Затронул только один цвет, синий дальше не хочет (

[BGpro]

я наверное не правильно вопрос поставил , я хочу чтобы цвет менялся при нажатии на кнопку но без рандома , просто красный, синий, красный, синий

[Сергей delphinpro]

BGpro, Я ошибся

button.addEventListener("click", () => {
  const hexColor = colors[index = Math.abs(--index)]; // Здесь
  document.body.style.backgroundColor = hexColor;
  color.style.backgroundColor = hexColor;
});

[Сергей delphinpro]

[BGpro]

Спасибо огромное