<button id="btn1">click me</button>
/**
* This is just a syntactical variation of
* the first proposed solution.
*
* It is very common to use arrow functions
* and to declare them directly in the
* "addEventListener" instruction.
*
* You are going to see this in almost
* every codebase you will be working on.
*/
// Step1: take a reference to the button
// thanyou want to make clickable.
const btn1 = document.getElementById('btn1')
// Step2: associate an "anonymous event
// handler" using an arrow function
btn1.addEventListener('click', () => {
alert('You did it!')
})
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.