Question

Okay I have two classes for two links and two divs with different information. What I am trying to do is have it so when you click on one link it adds a 2 to both of the classes and makes the second div visable. When you click on the other link it takes off a 2 and makes the first div visable.

Here is what I currently got

$("#posts").click(function () {
    $("#sideboxtopleft").toggleClass("2");
    $("#arrow").toggleClass("2");
});

Pretty much posts is the link, when when you click on it. It would make sideboxtopleft and arrow, sideboxtopleft2 and arrow2 and when you clicked on comments it would take off the 2 of both of those. Then there are two divs, one is set to hidden and I want to make it visable and set the other to hidden. Pretty much creating a tab system with changing tab classes.

Answer 1

toggleClass adds or removes a new class, it doesn’t just append the string.

A potential solution would be to do the following:

$("#posts").click(function () {
    $("#sideboxtopleft").toggleClass("sideboxtopleft").toggleClass("sideboxtopleft2");
    $("#arrow").toggleClass("arrow").toggleClass("arrow2");
});