Applying more CSS properties within one line

Question

Is there any possible way to apply more than CSS to a control through a single line of code.In below example i could i apply only one property

$('#<%=lblMessage.ClientID%>').css("color", "#16428b");

Suppose if i would like to apply font or background.. how it is possible

-Thanks

Answer 1

.css({
    color: "#16428b",
    backgroundColor: "#f0f",
    "font-size" : "3em"
})

note the different styles of defining the CSS rules: camelCase for javascript, "css-style" for quoted strings.

This is also much more efficient than multiple chains of successive .css() calls, since it doesn't require multiple passes through your jQuery object.

Answer 2

You just chain them:

$('#<%=lblMessage.ClientID%>')
   .css("color", "#16428b")
   .css("font-family", "Helvetica, Arial, sans-serif")
   .css("background", "#ccc");

Most methods in the jQuery object returns the jQuery object itself, so you just apply another method to the return value.

Edit:
If it's efficiency you are looking for it's of course best to update the element style directly:

var e = document.getElementById('<%=lblMessage.ClientID%>');
e.style.color = '#16428b';
e.style.fontFamily = 'Helvetica, Arial, sans-serif';
e.style.backgroundColor = '#ccc';