Modify css class with javascript

1. Using style Property (Inline Styling)

The simplest way to include CSS in is by directly modifying the style property of an HTML element.

This method applies styles inline, directly to the elements, and overrides any external or internal CSS rules.

• element.style.property is used to modify the inline styles of an individual HTML element.
• This method is limited to applying styles to a single element at a time.
• It provides fine control over individual elements but can become cumbersome for larger styles or multiple elements.

2.

Creating and Appending a style Tag

Another approach is to create a <style> tagThis method is useful when you want to include multiple CSS rules that are applied globally across your web page.

• document.createElement('style') creates a new <style> element.
• style.innerHTML allows you to add CSS rules to the newly created <style> tag.
• document.head.appendChild(style) appends the <style> tag to the document's head, effectively applying the CSS rules to the page.
• This approach ena
  how to add multiple css class in javascript
  how to apply css class conditionally in javascript