How to apply !important using .css()?

Question

I am having trouble applying a style that is `!important`. I’ve tried: $("#elem").css("width", "100px !important");This does **nothing**; no width style whatsoever is applied. Is there a jQuery-ish way of applying such a style without having to overwrite `cssText` (which would mean I’d need to parse it first, etc.)?**Edit**: I should add that I have a stylesheet with an `!important` style that I am trying to override with an `!important` style inline, so using `.width()` and the like does not work since it gets overridden by my external `!important` style.Also, the value that will override the previous value **is computed**, so I cannot simply create another external style.

Answer 1

Hi there. In general, !important declarations should be used sparingly so having one declaration overriding the other probably means it is time to revise your css. If you want to keep the current css you need to add more specificity to the selector whose rules you want to prevail, otherwise those rules won't be applied. Something like this (may need less selector but this gives you an idea):

$('#grandParent #parent #child').css('width', '100px !important');

I hope this helps.