I have a background image which is randomly selected on session start but can be changed by a button which triggers an onclick function.

selectImg() is run on page load while resetImg() is what is run when the appropriately named reset button is clicked. How can I make this so rather than reloading the whole page it could just refresh the individual element to change the image - preferably without using libraries such as jQuery?

var images = new Array("assets/img/beach.jpg", "assets/img/city.jpg", "assets/img/valley.jpg", "assets/img/hills.jpg", "assets/img/rocky-beach.jpg", "assets/img/trees-lake.jpg", "assets/img/trees.jpg");


function selectImg() {
  if ("headerImage" in sessionStorage) {
    document.getElementById('headerImage').style.backgroundImage = "url(" + sessionStorage.getItem("headerImage") + ")";
  } else {
    var selector = Math.floor(Math.random() * images.length);
    sessionStorage.headerImage = images[selector];
    document.getElementById('headerImage').style.backgroundImage = "url(" + sessionStorage.getItem("headerImage") + ")";
  }
}

function resetImg() {
  sessionStorage.removeItem("headerImage");
  location.reload();
}