CODEWITHSUNDEEP
javascriptjquerycss
user1726549
user1726549

Reputation:

How to add CSS to a class through jQuery?

I'm using jQuery Mobile for a simple mobile app, and I want to add a CSS to it. Currently I have the following CSS for the class.

.home-button-edited {
    border: 1px solid #2373A5;
    margin-top: 1px !important;
    background:#3496da;
}

Then in JS part I have the following code segment:

var viewport = {
    width: $(window).width(),
    height: $(window).height()
};

document.addEventListener("deviceready", setHomeButton, false);

function setHomeButton() {
    var difference = viewport.width - 85;
    $('.home-button-edited').css("left", "difference !important");
}

The point is that, I want to add a left property to .home-button-edited, with the value that I get in the difference variable, and it also should have an !important property. Any ideas?

Upvotes: 0

Views: 81

Answers (3)

A. Wolff
A. Wolff

Reputation: 74420

You could use in your case:

$('.home-button-edited').css('cssText','left: '+difference+'px !important');

Upvotes: 0

Mark
Mark

Reputation: 4873

 $('.home-button-edited').css("left", difference+"!important");

or

 $('.home-button-edited').style.setProperty( 'left', difference, 'important' );

Upvotes: 1

Mayank Tripathi
Mayank Tripathi

Reputation: 1342

Error in your function.

function setHomeButton() {
    var difference = viewport.width - 85;
    $('.home-button-edited').css("left", difference + " !important");
}

Upvotes: 0

Related Questions