CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user3378649
user3378649

Reputation: 5354

How to dynamically change CSS using JS

I am working on complicated animation, I am trying to add effects by adding another class based on the val I am getting.

I have different css classes, and I wanna know how to dynamically add them this way.

.. Class="box bottom right"

when I add new class (eg: red). It should be in my code this way:

.. Class="box bottom right red"

I am trying to change the css based on value I am calculating. 

var els=2;

  function changeColor(els) {
    if (els>0) {
            $("box bottom right").addClass("red");
    } else{
            $("box bottom right").addClass("green");
    };

  }

Here is code: http://jsfiddle.net/BB6ED/1/

Upvotes: 0

Views: 51

Answers (1)

Felix
Felix

Reputation: 38112

You need to use . to target elements by class as well as calling your function on page load:

var els=2;

  function changeColor(els) {
    if (els>0) {
            $(".box.bottom.right").addClass("red");
    } else{
            $(".box.bottom.right").addClass("green");
    };

  }

changeColor(els);

Updated Fiddle

Upvotes: 2

Related Questions