How to change css from javascripts

Tags: javascript,css,jquery-ui

Problem :

How can I change CSS from javascripts. Im using JQUERY (Dialog) and I want to change the style of a DIV from javascript.


Solution :

Check out the jQuery documentation. If you want anything it will be there.

Anyhow, if you want to add styles to elements, you need to use the css function, which has a few variants.

$(selector).css(properties);  // option 1
$(selector).css(name, value); // option 2

So if you have a DIV with ID of "mydiv" and you want to make the background red, you would do

$("div#mydiv").css({'background-color' : 'red'}); // option 1
$("div#mydiv").css('background-color','red');     // option 2

The first way is easier if you're setting multiple things at once.

If you want to check what a property is currently set to, you would use a variant of the 2nd option, just omit the value.

var color = $("div#mydiv").css('background-color');

Would make the var color be red if you already set it above, for example.

You can also add and remove classes, doing something like


    CSS Howto..

    In what circumstances is flex-shrink applied to flex elements and how does it work?

    How to make first page fullscreen and others not [closed]

    How to vertically align text to the right of some text using css? [closed]

    How to apply css to id generated dynamically?

    How to access CSS children properly?

    How to Vertical align text in div

    How to make the height of a div within a master page expand in a content page?

    How to add tags/images on javascript fetched textarea data?

    How to hide element that is currently mousedover and shown via :hover css pseudo class via jQuery

    How to Clear Every Third Box in a Row? [duplicate]

    How do I create a menu that appears on hover?

    How to remove all input outline?

    How to create rolldown content with css?

    How can I do the following thing without inline styling?

    How can I change the font (family) for the labels in Chart.JS?

    How to make html button look pressed in using css?

    How to decrease the page load time when multiple css are used

    ASP.NET MVC: How do other people apply conditional CSS classes?

    How do I get rid of this blue halo around the close dialog button with jqueryui?

    HTML5/CSS: how to implement a scroll bar

    Show div on button click with multiple divs

    How to bring parent div front?

    How to enlarge and shrink an element in a loop animation through jquery or CSS

    how to ignore br or line breaks in text with pure css truncate text button

    Search type links in Yahoo - how to implement similar behaviour

    Div's don't show up

    How to use CssStyleCollection for a UserControl?

    How to make divs appear and disapear on hover in css?

    Slideshow by changing background-image CSS attribute using JQuery in Drupal 7

    How to define variable with CSS value from HTML tag? [closed]