Range of variables or sth else? very beginning JS

Question

Sorry for mistakes - my first post. I'd like to click on the 'Try it' button and change the type of the first 'ok' input. After this change I'd like to click the 'Try it' button again and change the type of the element with id="inputt" to INPUT again. I think it's sth wrong with the range of my variable done which tells if i have 2 buttons or input and button.

//JS
window.onload = function Load(){
var done = false;
var foo = document.getElementById('g');
 if(!done){
foo.onclick = Change1;
 }else{
foo.onclick = Change2;
}

};

function Change1(){
 inp = document.getElementById('inputt');
 inp.setAttribute('type', 'button');
 done = true;

}
function Change2(){
 but = document.getElementById('inputt');
 but.setAttribute('type','input');
}

//HTML
<input value="ok" id="inputt">
<p>Click the button below to set the type attribute of the button above.</p>
<button id="g">Try it</button>

Answer 1

The window.onload event is not going to get executed again, it only happens once when the window...loads

see if this is what you want. http://jsfiddle.net/7W4Xw/1/

 //JS
 window.onload = function Load(){
     var foo = document.getElementById('g');
     foo.onclick = Change1;
 };

 function Change1(){
     inp = document.getElementById('inputt');
     inp.setAttribute('type', 'button');
     var foo = document.getElementById('g');
     foo.onclick = Change2;
 }

 function Change2(){
     but = document.getElementById('inputt');
     but.setAttribute('type','input');
 }