Jquery, multiple CSS properties in variables

Question

I would like to have, with Jquery, multiples css properties in variables. This code doesn't work :

var deco = {"text-decoration":"none"};
var bak = {"background-color":"cyan"};


$("a").css( deco , bak );

What is wrong in my code ? Thanks. Nicolas.

T.J. Crowder · Accepted Answer · 2016-11-12 11:50:06Z

4

What's wrong is that you're calling the css function in a way it's not written to be called. The version accepting an object just accepts a single object.

You can combine your objects as you pass them in with $.extend:

$("a").css( $.extend( {}, deco , bak ) );

Example:

console.log("And...");
setTimeout(function() {
  var deco = {"text-decoration":"none"};
  var bak = {"background-color":"cyan"};
  $("a").css( $.extend( {}, deco , bak ) );
  console.log("...done");
}, 800);

<a href="http://example.com">Testing 1 2 3</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Side note: I'd strongly recommend using a class for that rather than inline styling, unless you have a strong, specific reason not to.

answered Nov 12, 2016 at 11:50

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

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

1 Comment

Nicolas Bocquel Over a year ago

It works very well ! ...I use, of course, a style sheet for all my css rules, but here, this is for a really special case. Many Thanks for your help. Nicolas.

Collectives™ on Stack Overflow

Jquery, multiple CSS properties in variables

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related