addClass(“test”) doesn't work - but css(“background”,“red”) does

Question

Anyone know why?

Here's the JS:

$(".screenshots .tab1").hover(function() {
    $(".section1").addClass("test");
        }, function() {
    $(".section1").removeClass("test");
        });
    });

And the CSS:

.test {
    background: black;
    border: 1px solid #ffb75b;
    background-color: #fffadb;
    } 

Answer 1

Maybe there is a css entry that overrules yours. Try this:

background-color: #fffadb !important;

Answer 2

Maybe it is just a copy and paste error but you have a }); to much. Should be:

$(".screenshots .tab1").hover(function() {
    $(".section1").addClass("test");
}, function() {
    $(".section1").removeClass("test");
});

See a live example: http://jsfiddle.net/wmD4E/

Of course background: black will have no effect because background-color: #fffadb; overwrites it.

Answer 3

I think it is because you have an extra }); at the end of your JS code. see working example here http://jsbin.com/adeye4/edit

Answer 4

Try specifying background once:

.test {
    border: 1px solid #ffb75b;
    background-color: #fffadb;
}