jQuery: Toggling between 3 classes (initially)

Question

I\'ve seen several posts here on SO but they are too specific in functionality and structure, and what I\'m looking for is something more universal that I or anyone can use

Answer 1

You can do this :

$('.toggle').click(function () {
  var classes = ['class1','class2','class3'];
  $('div').each(function(){
    this.className = classes[($.inArray(this.className, classes)+1)%classes.length];
  });
});

Demonstration

Answer 2

Here is another approach:

if ($(this).hasClass('one')) {
    $(this).removeClass('one').addClass('two');
} else if ($(this).hasClass('two')) {
    $(this).removeClass('two').addClass('three');
} else if ($(this).hasClass('three')) {
    $(this).removeClass('three').addClass('one');
}