const colors = ["green", "red", "blue", "black"];
const div = document.getElementsByTagName('div');
const buttons = document.querySelectorAll('button');
let x = 0;
const changeColor = () => {
div[0].style.backgroundColor = colors[x++];
if(x === colors.length){
x = 0;
}
}
let changeColors = setInterval(changeColor, 1000);
buttons[0].addEventListener('click', function(){
clearInterval(changeColors);
changeColors = null;
})
buttons[1].addEventListener('click', function(){
if(changeColors === null){
changeColors = setInterval(changeColor, 1000);
};
})
div{
width: 150px;
height: 150px;
border-radius: 50%;
background-color: red;
}
<div></div>
<button>Clear Interval</button>
<button>Return Interval</button>