CODEWITHSUNDEEP
jquery
simple
simple

Reputation: 2397

Step through all children and remove all styles

I have a sharepoint site that is driving me crazy trying to remove all the junk code so I can apply my design. I am curious if jquery could strip out all css from all elements inside the containing div?

For example, how could I strip all css formatting from this html using jquery?

<div id="myID" > 
    <span class="myClass1">
        <span class="myClass2"></span> 
    </span> 
    <span class="myClass3">
        <ul class="myClass4" style="padding-left:100px;">
            <li>item</li>
        </ul>
    </span> 
</div>

Upvotes: 3

Views: 3923

Answers (4)

EliteRaceElephant
EliteRaceElephant

Reputation: 8162

The problem for me from the other answers was that not all children would be processed or an attribute class without =classname would remain.

This worked for me:

$("#myID *")                   // select all children of elements that containt id="myID"
  .each(function(){            // iterate through all children
  $(this).removeAttr("class"); // remove class attribute from each child
});
console.log($("#myID").html());

Upvotes: 0

Jason Sperske
Jason Sperske

Reputation: 30436

Try this (updated for the last time demo) (thanks to Fabrício for the pointer):

$('#myID [style]').removeAttr('style');

This will strip any inline style attributes of only child nodes of <div id="myID">, and leave everything else intact (removing the classes on those nodes can have other effects besides styling). You could defined some CSS that only applies to the child nodes of <div id="myID"> like a CSS reset. That might look like this:

#myID * {
  border: thin red solid;
}

Upvotes: 5

Fee
Fee

Reputation: 243

To strip all the css I think you would have to remove all the style class and id attributes.

This is my DEMO

This Javascript removes the style attribute and class

$("#myID *").removeAttr("style");
$("#myID *").each(function(){
    $(this).removeClass($(this).attr("class"));
});

Upvotes: 1

Mohamed Omezzine
Mohamed Omezzine

Reputation: 1104

try :

$('#myID').find('*').attr('class', '');

Upvotes: 0

Related Questions