如何制作一个可以在3种背景颜色之间切换的按钮？

<button id="colorButton">切换颜色</button>

#colorButton {
  background-color: red;
  color: white;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
}

var colorButton = document.getElementById("colorButton");
var colors = ["red", "green", "blue"];
var currentColorIndex = 0;

colorButton.addEventListener("click", function() {
  currentColorIndex = (currentColorIndex + 1) % colors.length;
  colorButton.style.backgroundColor = colors[currentColorIndex];
});