Add and remove a class on click using jQuery

Question

Please see this fiddle   I am trying to add and remove a class on li elements that are clicked  It is a menu and when one clicks on each li item I want it to gain the class and all other li items have the class removed  So only one li item has the class at a time  This is how far I have got  see fiddle   I am not sure how to make the  about-link  start with the class current  but then it is remove when one of the other li items are clicked on          about-link   addClass  current        menu li   on  click   function           this  addClass  current   siblings   removeClass  current

User · Answer

The other li elements are not siblings of the a element       menu li a   on  click   function          this  addClass  current   parent   siblings   children   removeClass  current

User · Answer

you can try this along  it may help to give a shorter code on large function       menu li a   on  click   function           li a current   toggleClass  current

User · Answer

Try this in your Head section of the site     function             menu box list li   click function                 menu box list li active   removeClass  active              this  addClass  active

User · Answer

You can do this -      about-link   addClass  current        menu li a   on  click   function e       e preventDefault            menu li a current   removeClass  current          this  addClass  current          Demo  Fiddle

User · Answer

You re applying your class to the  lt a gt  elements  which aren t siblings because they re each enclosed in an  lt li gt  element  You need to move up the tree to the parent  lt li gt  and find the   elements in the siblings at that level       menu li a   on  click   function      this  addClass  current   parent   siblings   find  a   removeClass  current          See this updated fiddle

User · Answer

Here is an article with live working demo Class Animation In JQuery  You can try this     function             btnSubmit   click function             btnClass   removeClass  btnDiv   addClass  btn                 you can also use switchClass   method - it allows you to animate the transition of adding and removing classes at the same time     function                  btnSubmit   click function                      btnClass   switchClass  btn    btnReset   1000   easeInOutQuad

User · Answer

Why not try something like this       menu li a   on  click   function            menu li a current   removeClass  current          this  addClass  current          JSFiddle

User · Answer

var selector     classname     selector  on  click   function          selector  removeClass  classname          this  addClass  classname

[jquery] Add and remove a class on click using jQuery?

Examples related to jquery

Examples related to html

Examples related to css

Examples related to class

Examples related to click