Jquery - change CSS property (but don't add the "style" attribute to div)

Question

i have a code like this:

    if ($(this).css("background-color")==="rgb(217, 217, 217)") {
        $(this).css("background-color", "#999");
    }else{
        $(this).css("background-color", "#fff");
    }

but the bg color rgb(217,217,217) is a hover BG color change effect...

when I change the bg color of my div ..... ---> jquery is adding a "style=" ... " attribute to my DIV,

but after that my css hover code doesnt work no more because the "style" attribute is blocking my "class" attribute...

So how can i change with jquery CSS class attributes without adding a style="" attribute directly into my DIV?

THanks for any help

this is my fiddle demo

https://jsfiddle.net/qcvcga8k/24/

please click at the name "Manuel Neuer" (1st in the list) and after the BG changed to grey, click again on the name.... the BG is changing again to white, BUT the hover effect is missing...

i would be so happy, if you have any hints for me ;)

Thx

Alex

Make the style a class and do $(this).addClass('myClass'); instead of doing it with .css(...) — Tyler Roper
– Tyler Roper, Commented Oct 23, 2016 at 16:39
was not the goal! but I found a solution with this here: $(this).attr('class', 'greyRow'); --------> THX for your help! — nbg15
– nbg15, Commented Oct 23, 2016 at 17:13
Sorry to intervene, but $(this).attr('class', 'greyRow'); is inefficient use of jQuery, which has dedicated methods to manage class values. — trincot
– trincot, Commented Oct 23, 2016 at 17:18

trincot · Accepted Answer · 2016-10-23 17:15:16Z

1

Define a CSS class for this, in the <style> element:

tr:selected { background-color: #999 }

Then replace your code:

if ($(this).css("background-color")==="rgb(217, 217, 217)") {
    $(this).css("background-color", "#999");
}else{
    $(this).css("background-color", "#fff");
}

with this:

$(this).toggle('.selected');

answered Oct 23, 2016 at 17:15

trincot

357k38 gold badges282 silver badges339 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Jquery - change CSS property (but don't add the "style" attribute to div)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related