<p id=”text”>

<button onclick=”document.getElementById(‘text’).

innerHTML=‘Paul’”>My name is?</button>

As you can see, to assign the action to the event of the button being clicked, we add an ‘onclick’ attribute to our HTML tag, followed by the JavaScript action in single or double quotations. The above example will enter the text “Paul” into the div with the id ‘text’ when the button is clicked.

As you can see in the above example, we are writing pure JavaScript directly into the attribute’s value, which is fine for small snippets of JavaScript, but what about when we want to write more complex functions? It can quickly become troublesome. As such, it is common in JavaScript to assign functions to the attribute instead of code itself. Therefore, you are far more likely to see this: