Remove css style from element

Question

I would like to remove parent styling added by a css stylesheet using Jquery. I Googled but all I can find is removing inline styles or classes

HTML

<p><span>text</span></p>

CSS

p{
    width:300px;
    height:200px;
    border:solid 3px #000;
    padding:10px;
    font-size:23px;
}

span{
    width:100%;
    height:100%;
    background: #ccc;
    padding:10px;
}

I tried many Jquery variations, one of them:

$('span').parent().removeAttr( 'style' );

JsFiddle example

score 3 · Answer 1 · answered Mar 18 '13 at 08:58

3

you can not removeAttribute from P because there is no inline css or style attribute set for P tag.

You can overwrite default css using .css()

What you can do.

$('span').parent('p').css({ width:350px;height:250px;border:solid 5px #000;padding:5px;font-size:20px;}); overwrite rules as above
create class for parent P and use .removeClass().

answered Mar 18 '13 at 08:58

Dipesh Parmar

27,090
8
61
90

1

@Youss http://stackoverflow.com/questions/754607/can-jquery-get-all-css-styles-associated-with-an-element take a look at here. when you have css applied to dom just remove it instead of css2json – Dipesh Parmar Mar 18 '13 at 09:20

PSR · Answer 2 · 2013-03-18T09:06:09.237

0

apply cssClass to parent element and then by using removeClass in jQuery we can remove the class.

<p class="className"><span>text</span></p>


.className{
    width:300px;
    height:200px;
    border:solid 3px #000;
    padding:10px;
    font-size:23px;
}


    $('span').parent().removeClass( 'className' );

edited Mar 18 '13 at 09:06

answered Mar 18 '13 at 08:57

PSR

39,804
41
111
151

I know how to add and remove ClassName, I really would like to remove attribute styling instead – Youss Mar 18 '13 at 09:07
but there is no inline css or style – PSR Mar 18 '13 at 09:08
The thing is Im scraping an external website. I cant get to its stylesheet, so I cant add a class name to attributes – Youss Mar 18 '13 at 09:10

Remove css style from element

2 Answers2