When would I use a DOM element's .style property instead of CSS?

Question

When would I use a DOM element’s .style property instead of CSS?

Answer

For simple styles or animations we will want to choose CSS over styling with the DOM .style method. For example, we should use CSS for things like setting a background image, simple transition effects on the :hover state of an element, etc. We can use the DOM’s .style method instead when we need more complicated transitions/animations like special animation effects such as bouncing, slowing down, pausing, or stopping animations, etc.