There are many methods of adding and removing classes using Jquery. Here we used one of the most simple among them.
Jquery has basically two methods for adding and removing classes:
1. .addClass() – add specified classes to the particular element. Click here for official documentation.
2. .removeClass() – remove single, multiple or all classes from particular element. Click here for official documentation.
Solution: In the below example there is basically ten td tag which is inside one tr tag. On click of each td tag we have called the function. Inside this function initially, we have removed all the active classes of all td tag present in the HTML and added the active class to currently selected td tag with the help of “this” keyword (This process will follow every time we select td in the DOM). Check the code below.
See the Pen Add and remove class Using Jquery by Jagdish Patil by Jagdish patil (@jagdishpatil) on CodePen.0
Happy Coding. 🙂
Front-end Developer. Passionate about designing, digital marketing, writing, and tea. You can connect with me on social media by links given below.