Changing CSS properties of elements
Every HTML DOM element, when taken by javaScript comes with a native style property. This is the 'style' attribute in reality and holds information about the CSS properties of an element.
That means that, when an event occurs, we can change the opacity from an element in order to make it fade in or fade out on the fly. Additionally we can change color, position, size and ALL the known css properties that we know.
The syntax is being shown above. Basically we change the display property of our paragraph (through .style.display) from 'block' to 'none' in order to hide it.
Attention: There are some css properties that take two words, and these are united with a '-' in between. Like background-color etc.
Typing something like element.style.background-color = 'red'; will produce an error, because '-' in JS is the operator for subtraction. So JS as convention deals with these circumstances by using the 'camelCase' syntax.
So the correct implementation will be element.style.backgroundColor = 'red';
* Values of all css properties come in strings when implemented through JS, be careful of the quotes!
