Matt Matt - 5 months ago 9
CSS Question

How can I erase all inline styles with javascript and leave only the styles specified in the css style sheet?

If I have the following in my html:

<div style="height:300px; width:300px; background-color:#ffffff;"></div>


And this in my css style sheet:

div {
width:100px;
height:100px;
background-color:#000000;
}


Is there any way, with javascript/jquery, to remove all of the inline styles and leave only the styles specified by the css style sheet?

Answer

$('div').attr('style', '');

or

$('div').removeAttr('style'); (From Andres's Answer)

To make this a little smaller, try this:

$('div[style]').removeAttr('style');

This should speed it up a little because it checks that the divs have the style attribute.

Either way, this might take a little while to process if you have a large amount of divs, so you might want to consider other methods than javascript.

Comments