make sure to check out 'how to reference an element'
one thing we can do with references to elements is ask for them to let us know when the user interacts
with them. for instance, we can make a element run some javascript every time it gets clicked on.
we first get a reference to our element like we did before, then we use a function on the element reference
called 'addEventListener'. addEventListener takes 2 arguments, the first is what sort of event we want to
listen for, and the second is the function that runs when that event happens.
we're also going to write our own function. remember how functions are just pre determined things that the
browser can do, and how they can take arguments? we can make our own using the 'function' keyword. In this case
we're going to name the first argument that gets passed to our function 'clickEvent'. when a click happens
on our element, the browser will call our function called 'myClickHandler' and it will include a package of
information about the click as that first argument.
in this case, we'll use the 'target' property of the 'clickEvent' in 'myClickHandler', which is the most specific thing that got clicked on. this means that we'll replace the most specific element that is under the mouse for each click. go ahead and try and click on different things. what if instead of 'clickEvent.target.innerText' you did 'myElementInJS.innerText'