“this” keyword doesn’t seem to work

Question

I am trying to understand how the this keyword works in JavaScript and I made this script:

function click(){
    this.innerHTML="changed";
}

Used in this HTML:

<button id="clicker" onclick="click()" >Click me</button> 

But it doesn't work, can anyone explain why?

Answer 1

this exists only in the scope of the onclick event itself. It is not bound automatically to other functions.

Pass it on like this:

function click(element){
element.innerHTML="changed";
}

and the html:

<button id="clicker" onclick="click(this)" >Click me</button>