JSFiddle - React, Tailwind, and code Playground

by aprilkw

JavaScript

// 'this' will always refer to the object calling the function
// For DOM programmers, 'this' means you have a way to access the element that's firing the event,  e.g.

var links = document.getElementsByTagName("a");
for(var i = 0; i < links.length; i++) { links[i].addEventListener("click", function(eve){ eve.preventDefault(); this.textContent += "."; }); }

// The above will concatenate a dot after the text in every link on a page, when you click it.
// The event listener is called with an 'event' object, which has info about the event that was done. It also lets you prevent that default event's process, which in the case of links means "don't follow that link"