Question

Okay, I’m a real beginner when it comes to jQuery, and although I’ve tried searching for this already, I can’t seem to find an answer (I’m probably not phrasing it correctly).

When one of the li’s are clicked, I want to add an element. However, if the li has already been clicked (and the class already added), if the user clicks again, I want the class removed. So far, this is what I have:

(function($){ 
   $(".list li").click(function() {
      $(this).addClass("hilite");
      $(this).attr("BeenClicked", "true");
   });
 })(jQuery); 

<ul class="list">
   <li> Something
   <li> Something else
</ul>

I need to create code that essentially checks the attribute to see if “BeenClicked” is set to true.

Answer 1

You’ll have to use jQuery’s toggleClass:

(function($){ 
   $(".list li").click(function() {
      $(this).toggleClass("hilite");
   });
})(jQuery);