How to remove a class from all jquery elements

Question

I am changing the element class with the following

$("#"+data.id).addClass("highlight") 

Given the list below.

  <div id="menuItems"> <ul id="contentLeft" class="edgetoedge"> <li class="sep" ">Shakes and Floats</li> <li id="297"><a href="#" onClick="cart('297','add')"><small>$5.00</small><b>Vanilla</b> </a></li> <li id="298"><a href="#" onClick="cart('298','add')"><small>$5.00</small><b>Peanut Butter</b></a></li> <li id="299"><a href="#" onClick="cart('299','add')"><small>$5.00</small><b>Combo</b></a></li> <li id="300"><a href="#" onClick="cart('300','add')"><small>$5.00</small><b>Chocolate</b></a></li> <li id="301"><a href="#" onClick="cart('301','add')"><small>$5.00</small><b>Strawberry</b></a></li> <li id="303"><a href="#" onClick="cart('303','add')"><small>$5.00</small><b>Banana</b></a></li> <li id="304"><a href="#" onClick="cart('304','add')"><small>$5.00</small><b>Root Beer Float</b></a></li> <li id="305"><a href="#" onClick="cart('305','add')"><small>$5.00</small><b>Espresso</b></a></li> </ul> </div> 

I suggested that I can remove the class using this ...

  $(".edgetoedge").removeClass("highlight"); 

But that does not work. How to delete a class?

Answer 1

You need to select the li tags contained in the .edgetoedge class. .edgetoedge only matches the ul tag:

 $(".edgetoedge li").removeClass("highlight"); 

Answer 2

try: $(".highlight").removeClass("highlight"); . By choosing $(".edgetoedge") , you only perform functions at this level.

Answer 3

This simply removes the highlight class from everything that the edgetoedge class edgetoedge :

 $(".edgetoedge").removeClass("highlight"); 

I think you want this:

 $(".edgetoedge .highlight").removeClass("highlight"); 

The .edgetoedge .highlight selects everything that is a child of something with the edgetoedge class and has a highlight class.

Answer 4

You can try the following:

  $(".edgetoedge").children().removeClass("highlight"); 

Answer 5

 $(".edgetoedge>li").removeClass("highlight");