jQuery addClass on click to specific element

Question

I am trying to animate a menu item. On move over it expands left, and on mouse out it contracts back. This works fine.

I am also trying to add a class on click to give the button a specific color but it doesn't seem to work.

Here is a fiddle http://jsfiddle.net/g3ra912j/

css:

    #menu1 .active {
        background-color: #00f;
    }

script:

$("#menu1").click(function () {
    $(this).toggleClass("active")
})

onclick it supposed to turn blue, but it doesn't. What am I doing wrong?

Thanks

user488187 · Accepted Answer · 2015-02-11 01:27:11Z

1

You have an extra space in your CSS. Should be

#menu1.active {
    background-color: #00f;
}

since you are adding the class .active to the same element as has the id menu1. The original CSS would target an element with class .active inside #menu1.

answered Feb 11, 2015 at 1:27

user488187

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

2 Comments

PRAH Over a year ago

you can use -- #menu1.active {background-color: #00f;} -- or just this -- .active {background-color: #00f;}

Michael Seltenreich Over a year ago

I have to wait 7 minutes before I can mark yours as the correct answer but I will soon. Thanks!! Also, I am going to have 4 colors for the menu buttons. is my approach for giving each an individual color correct or is there a better way?

Jagadeesh · Accepted Answer · 2015-02-11 01:36:09Z

0

i had to deal with the same problem. use addClass('active') instead toggleClass. just have an if condition to check if the element already has active class before adding active class

let me know if it works.

and about the css bobdye was right

answered Feb 11, 2015 at 1:36

Jagadeesh

1881 silver badge3 bronze badges

Collectives™ on Stack Overflow

jQuery addClass on click to specific element

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related