How to change CSS of one page from another page using JavaScript

Question

I have two web pages:

pageone.html and pagetwo.html

In pageone.html , there is a button with an id of change-color When you click that button, the background color of pagetwo.html is supposed to turn green. But that isn't happening. Can someone help me?

 function changeColor() { //code var pageTwo = 'pagetwo.html'; pageTwo.style.backgroundColor = "green"; } 

 <button type="button" id="change-color" onclick="changeColor">Change Background Color</button> 

Answer 1

You can try like below

In pageone.html

 window.localStorage.setItem("bg", "")
 function changeColor() {
         window.localStorage.setItem("bg", "green");
 }

In pagetwo.html

<script>
var bg = window.localStorage.getItem("bg");
if(typeof bg!= 'undefined' && bg != ""){
    //Set your background using bg variable
}
</script>