apply custom style string to div using jquery

Question

I have a javascript variable with the following value:

var style ="border-left:12px solid;border-color:red;position:relative;"

How can I apply it to a div like below:

<div class='my-div'></div>

I tried:

$('.my-div').css({style});

but failed spectacularly :(

Read the docs, it's clearly explained how to make the object required. Or go simple and use a class. — Sterling Archer
– Sterling Archer, Commented Nov 3, 2015 at 18:19

Sterling Archer · Accepted Answer · 2015-11-03 18:22:27Z

1

var style = {
    borderLeft:'12px solid',
    borderColor:'red',
    position:'relative'
}

The object should look like this. The CSS method takes in an object param. Doing a style string concat will work, but it's ugly.

Or use a class and be simple.

$('.my-div').css(style); //append style object to jQuery object

Note that using this object notation can also be beneficial because the properties can have logic in them, say for animations, or changing value dependencies.

answered Nov 3, 2015 at 18:22

Sterling Archer

22.5k19 gold badges86 silver badges121 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

apply custom style string to div using jquery

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related