Function for the button Change Background

[authera]

I have a problem:

 <a href="#" class="btn btn-lg btn-default" onclick="red()">Change Background</a>
function red(){

document.body.style.backgroundColor="#C0C0C0";

}

Created a button on a page that changes background. And how do we make sure that when we press the same button, everything goes back to its original state, and it turns from one background to the other at every pressure?

[chanisef]

    function red() {
       document.body.classList.toggle('red-background');
    }

body {
    background-color: #FFFFFF;
}
body.red-background {

background-color: red;

}

<a href="#" onclick="red()">Change Background</a>