Jquery Onclick not happening second time

Question

I\'m a bit confused as to why this isn\'t working; I assume that because I\'m adding the class and its not being added back into the collection I\'m not sure.

Here i

Answer 1

It's because the click handlers are only applied to those elements that match at document load. You should use a separate class to identify all of the links, then set up a single click handler that looks at the class that the link has and then does the appropriate class transformation.

$(document).ready(function () {
    $('.clickable').click(function () {
       var $this = $(this);
       if ($this.hasClass('optional')) {
           $this.removeClass('optional').addClass('selected');
       }
       else if ($this.hasClass('selected')) {
            $this.removeClass('selected').addClass('rejected');
       }
       else if ($this.hasClass('rejected')) {
            $this.removeClass('rejected').addClass('optional');
       }
       return false;
    });
});


 
    a
    b
    c