HELP! I will try to make this as short and painless as possible. I have a select drop down menu that allows a user to change the colour scheme of my webpage ultimately by using .setAttribute and changing the "href" attribute to locate a different style sheet. Here is my problem, when I click a link to go to another page within my site it reverts back to the original colour scheme, I am not sure how exactly I would get my script to remember what the selectedIndex is on the previous loaded page. Here is my javascript:

"var styleSheet=document.getElementById("stylez");
var checker;

function changeColour() {
if(document.getElementById("colour").selectedIndex==1){
checker=1;
styleSheet.setAttribute("href", "styles/styles.css");
}
if(document.getElementById("colour").selectedIndex==2){
checker=2;
styleSheet.setAttribute("href", "styles/styles02.css");
}
}


if(checker==1) {
styleSheet.setAttribute("href", "styles/styles.css");
}
if(checker==2) {
styleSheet.setAttribute("href", "styles/styles02.css");
}"


The if statements at the end there are my attempt to get it to load the correct colour scheme, but what I am thinking is that the variable checker is equal to null because it is redeclared when the script is loaded on a new HTML page.

How can I fix this?

All comments are welcome, and thank you for any advice you may give