od0201,
<html>
<body>
<div style="padding: 20px;border: 1px solid red"></div>
<script>
const arrColors=['red','yellow','blue','black'];
const classOne = document.querySelector('div');
classOne.addEventListener('click', _ => {
let newIndex = classOne.dataset.newIndex = (classOne.dataset.newIndex || 0) % arrColors.length;
classOne.style.backgroundColor = arrColors[newIndex];
classOne.dataset.newIndex++;
})
</script>
</body>
</html>