Я пытаюсь создать кнопку, которая меняет цвет фона на градиент, который у него был при загрузке страницы

Question

Я пробовал разные вещи и не смог найти ответ на свой вопрос в Интернете. Я понятия не имею, как заставить кнопку вернуть цвет фона к цвету по умолчанию, который существовал при загрузке страницы.

var css = document.querySelector("h3");
var color1 = document.querySelector(".color1");
var color2 = document.querySelector(".color2");
var body = document.getElementById("gradient");
var button = document.getElementById("resetbckg")

function setGradient() {
	body.style.background = "linear-gradient(to right, "
		 + color1.value 
		 +", "
		 + color2.value 
		 + ") ";

		 css.textContent = body.style.background + ";";
}

function reset() {
	document.body.style.background = "linear-gradient(to right, "
		 + color1.value 
		 +", "
		 + color2.value 
		 + ") ";
}

button.addEventListener("click", reset);

body {
	font: "raleway", sans-serif;
	color: rgba(0,0,0,.5);
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .5em;
	top: 15%;
	background: linear-gradient(to right, #3AC7E2, #A16DCE);
  }

<input class="color1" type="color" name="color1" value="#00ff00">
<input class="color2" type="color" name="color2" value="#ff0000">
<div class="buffer col-12"></div>
<button id="resetbckg" onclick="reset()">Reset Background</button>

Answer 1

Чтобы удалить стиль фона тела и вернуться к стилю в правиле css, просто установите document.body.style.background = ''.

var color1 = document.querySelector(".color1");
var color2 = document.querySelector(".color2");

function setGradient() {
    document.body.style.background = "linear-gradient(to right, "
         + color1.value 
         +", "
         + color2.value 
         + ") ";
}

function reset() {
    document.body.style.background = "";
}

body {
    font: "raleway", sans-serif;
    color: rgba(0,0,0,.5);
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .5em;
    top: 15%;
    background: linear-gradient(to right, #3AC7E2, #A16DCE);
}

<input class="color1" type="color" name="color1" value="#00ff00">
<input class="color2" type="color" name="color2" value="#ff0000">
<div class="buffer col-12"></div>
<button onclick="setGradient()">Set Background</button><br/>
<button onclick="reset()">Reset Background</button>