I want to just change one of the elements in a class with jQuery
.myClass
{
background-color:#FFFFFF;
}
I want to programatically change this
A:
If you want to add the myClass class to a DOM element:
myElement.addClass("myClass");
If you want to remove the myClass class from a DOM element:
myElement.removeClass("myClass");
For more information, see the jQuery docs on hasClass, addClass, removeClass, and toggleClass.
Steve Harrison
2009-11-20 21:09:59
how do you remove an inline style? style="..."
CoffeeAddict
2009-11-20 21:19:35
@coffeeaddict: You manipulate style properties of the DOM element. For example, in plain JavaScript: `myElement.style.backgroundColor = "#fff";`. Using jQuery, that would be: `myElement.css("background-color", "#fff");`.
Steve Harrison
2009-11-20 21:26:24
See https://developer.mozilla.org/en/DOM/element.style and https://developer.mozilla.org/en/DOM/CSS for more information.
Steve Harrison
2009-11-20 21:32:57
but I want to remove an entire inline style tag
CoffeeAddict
2009-11-20 21:35:51
@coffeeaddict: I think you would have to set each style property to its default value. For example, if you had an element with an inline style such as `style="background-color: #fff; width: 200px; height: 200px;"`, you would set the background colour to `transparent`, the width to `auto`, and the height to `auto`. In jQuery code: `myElement.css({"background-color": "transparent", "width": "auto", "height": "auto"});`.
Steve Harrison
2009-11-20 22:38:10
Remember that in JavaScript, you're interacting with the *DOM* (see http://en.wikipedia.org/wiki/Document_Object_Model)—all the HTML/CSS code has been interpreted into a tree of objects—it's those objects that you have to interact with. So, removing the `style` attribute wouldn't do anything, because the styles are now part of the element object.
Steve Harrison
2009-11-20 22:42:14
+1
A:
This changes all .myClass elements. You can change multiple properties of the element.
$(".myClass").css({'background-color':'#BBBBBB'});
Vincent Ramdhanie
2009-11-20 21:10:48
+1
A:
http://docs.jquery.com/Attributes/addClass
$("p:last").addClass("myclass");
powtac
2009-11-20 21:10:49
+1
A:
jquery doesn't manipulate stylesheets AFAIK. what you can do is change the background-color of nodes in .myClass:
$('.myClass').css('background-color', '#FF0000');
just somebody
2009-11-20 21:10:56
+1
A:
To remove an entire inline style tag:
$('.myClass').removeAttr('style');
na_user
2009-11-20 21:37:46