The event in question is
'DOMContentLoaded', which triggers the
ready() handler. If the script is loaded after the HTML, (at end of
<body>) then we don't need to listen for that event. In other words,
would take effect on all
<div> elements in the page.
Only if the script is in the HEAD element, before the BODY. Script in the head will execute immediately, before the body element is populated. That is why the delay (deferral) is needed. We cannot act upon elements that do not yet exist. The script will run and nothing will happen.
This is a version that does not require deferral:
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
Note that the first two methods have optional units, and default to
px when none is given.
In the jQuery
.css() method we have two choices for writing the CSS property name, in quotes with the hyphen, as you have written it, and using JS style property names,
'borderRadius' (see above example).
When using only the parens to enclose the style property, only one can be given. Any others will be ignored. To write multiple properties with this method we need a declaration block (note the commas where semi-colons would normally be):