<button id="btn_things" onclick="doThings();">click here</button>
First of all, the page loads into your browser and you see a button saying "click here". The button has an attribute (which is not visible ot the user) called "onclick". This is the name of an event, and you can see a complete reference of html events on the w3schools website.
When the event is triggered (by clicking the button), the browser looks up the value of the onclick attribute and finds that it's "doThings();". This tells it to look for the "doThings" function in any script on the page.
The first instruction in the doThings() function is an assignment... assigning the value "yellow" to something called "document.getElementById('btn_things').style.color". The document.getElementById is an instruction to find the object in the HTML of that name, and when this is found, the instruction references the style property of the object and the "color" property of "style". Properties of elements in an HTML document can be looked up again on the w3schools website.