javascript - How to change a variable using onclick -

i'm trying change variable 0 4 using onclick function in html. below have. javascript / html :

function opentab(evt, page)   {      var i, pages, links;      //hide pages      pages = document.getelementsbyclassname("content");      (i = 0; < pages.length; i++) {          pages[i].style.display = "none";      }      //remove active tab      links = document.getelementsbyclassname("link");      (i = 0; < links.length; i++) {          links[i].classname = links[i].classname.replace(" active", "");          }      //set active page , tab      document.getelementbyid(page).style.display = "block";      evt.currenttarget.classname += " active";  }    var y=0;   var x=10;   var hp=x-y   var changevariable = function(){       alert("before : "+y)       y = 4;       alert("after : "+y);  //adding result element  document.getelementbyid("myresult").innerhtml = hp;  }  //binding click onto element   document.getelementbyid("clickme").addeventlistener("click", changevariable );

  <button id="clickme">   click me !   </button>  <div  id="myresult">  </div>

the top part of javascript tabs on page

you should avoid using inline event handlers since using them bad practice. achieve want doing

document.addeventlistener("domcontentloaded", function(event) {     var y=0;    var x=10;    var h=x-y;    document.getelementbyid("myresult").innerhtml = h;    var changevariable = function(){   y = 4;   h = x - y;   //adding result element   document.getelementbyid("myresult").innerhtml = h;  }    //binding "click" on element      document.getelementbyid("clickme").addeventlistener("click", changevariable);  });   

<button id="clickme">    click me !  </button>  <div id="myresult">  </div>