How to dynamically change CSS style attribute of DIV tag?

css, javascript

Solution

var div = document.getElementById('div1');

// Clear Value
div.setAttribute('style','');
  // OR
div.removeAttribute('style');

// Set Style / Append Style
div.style.backgroundColor = '#ff0000';

Don't modify the style attribute directly when adding or changing styles unless you want to remove them all.

JavaScript removeAttribute: https://developer.mozilla.org/en-US/docs/Web/API/Element.removeAttribute Javascript Style: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.style

Problem

We have a div tag: `<div id='div1' style="background-color:red"></div>` I would like to know how can we change the style attribute of this div tag:- Can we clear the style value? Can we append value to the existing style attribute ? Can we set new value to style attribute Thanks in advance.

Original source

Related problems