Remove CSS from a Div using JQuery

Question

You can remove specific css that is on the element like this:

$(this).css({'background-color' : '', 'font-weight' : ''});

Although I agree with karim that you should probably be using CSS classes.

You could use the removeAttr method, if you want to delete all the inline style you added manually with javascript. It's better to use CSS classes but you never know.

$("#displayPanel div").removeAttr("style")

Put your CSS properties into a class, then do something like this:

$("#displayPanel div").live("click", function(){
   $(this).addClass('someClass');
});

Then where your 'other functionalities' are do something like:

$("#myButton").click(function(){
   $("#displayPanel div").removeClass('someClass');
});

You can remove inline properties this way:

$(selector).css({'property':'', 'property':''});

For example:

$(actpar).css({'top':'', 'opacity':''});

This is essentially mentioned above, and it definitely does the trick.

BTW, this is useful in instances such as when you need to clear a state after animation. Sure I could write a half dozen classes to deal with this, or I could use my base class and #id do some math, and clear the inline style that the animation applies.

$(actpar).animate({top:0, opacity:1, duration:500}, function() {
   $(this).css({'top':'', 'opacity':''});
});