how use !important in jQuery

Question

$("#PtmIframe").contents().find("#header .sf-menu > li.sfHover > a, #header .sf-menu > li > a:hover, #header .sf-menu > li.sfHoverForce > a").css('background',"#"+HIhovcolor.!importanted).addClass("active");
        localStorage.setItem("HIhovcolor", HIhovcolor);

possible duplicate of [How to include !important in jquery](http://stackoverflow.com/questions/1986182/how-to-include-important-in-jquery) — Satpal, May 03 '14 at 10:30

Sajad Karuthedath · Answer 1 · 2014-05-03T10:26:28.663

2

General Syntax

jQuery.style(name, value, priority);

so use

$("#tabs").style('background', "#"+HIhovcolor, 'important');

adding-css-rules-with-important-using-jquery

edited May 03 '14 at 10:26

answered May 03 '14 at 10:07

Sajad Karuthedath

14,987
4
32
49

1

Can you provide the link to official document as I have never used it. – Satpal May 03 '14 at 10:26
1

@Satpal above link i provided may help you and i have also seen this type of an answer here too http://stackoverflow.com/a/8894528/2967572 – Sajad Karuthedath May 03 '14 at 10:28

score 1 · Answer 2 · answered May 03 '14 at 10:03

1

i think this will help you

$("#tabs").css("cssText", "height: 650px !important;");

answered May 03 '14 at 10:03

Gaurang s

831
6
18

score 0 · Answer 3 · answered May 03 '14 at 10:05

0

$("#PtmIframe").contents().find("#header .sf-menu > li.sfHover > a, #header .sf-menu > li     > a:hover, #header .sf-menu > li.sfHoverForce > a").css('background',"#"+HIhovcolor.+" !importanted").addClass("active");
    localStorage.setItem("HIhovcolor", HIhovcolor);

answered May 03 '14 at 10:05

Gaurang s

831
6
18

1

Why two different answers? Can't you write both of them in one answer itself? – Raging Bull May 03 '14 at 10:09
sorry that was my mistake – Gaurang s May 03 '14 at 10:10

score 0 · Answer 4 · answered May 03 '14 at 10:18

As i see you don't need to have a !important css hack with jQuery's .css() method, this method adds an inline style to the dom node you target.
!important should be used in .css files to a specific css class where you want it to override the styling.

Your case:

$("#PtmIframe").contents().find("#header .sf-menu > li.sfHover > a, #header .sf-menu > li > a:hover, #header .sf-menu > li.sfHoverForce > a")
.css('background',"#"+HIhovcolor)
.addClass("active");

This line .css('background',"#"+HIhovcolor) would output something like this:

<li style='backgroung: #yourColorCode' class='active'>.....</li>

So i have to say that inline styling have much priority than the css class styling, then you should not have any issues with this. Yet you can do this:

.css('background', '#' + HIhovcolor + ' !important')
 //---------------------------------^^^^^^^^^^^^^^^---concatenate it as string.

how use !important in jQuery

4 Answers4