I am changing the class of an element 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 assumed I could remove the class with this...
$(".edgetoedge").removeClass("highlight");
But this doesn't work. How can I remove the class?
To remove all CSS classes of an element, we use removeClass() method. The removeClass() method is used to remove one or more class names from the selected element.
To remove a class from the body element, call the classList. remove() method on the body object, e.g. document.
The removeClass() method removes one or more class names from the selected elements. Note: If no parameter is specified, this method will remove ALL class names from the selected elements.
You need to select the li
tags contained within the .edgetoedge
class. .edgetoedge
only matches the one ul
tag:
$(".edgetoedge li").removeClass("highlight");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With