What is the preferred way to create a jQuery object with attributes?

Question

When creating jQuery objects, I used the following syntax recently, as described here :

var $el = $('<div/>', {
   class: 'class-1 class-2'
});

Safari 5.0.5 gives a syntax error at the point where I am using the above construct.

Removing the second argument and adding classes with addClass fixes the error, but seems rather inelegant.

How do you create your objects? I tried using attr ({class: 'class-1'}), but got the same syntax error.

Answer 1

You cannot use class; it is a reserved word.

className:

var $el = $('<div/>', {
   className: 'class-1 class-2'
});

Answer 2

:

var $el = $('<div/>', {
    'class': 'class-1 class-2'
});

JSFiddle

Answer 3

Since it classis a reserved word, you need to put it in quotation marks.

var $el = $('<div/>', {
   "class": 'class-1 class-2'
});

Answer 4

You will receive an error message because it classis a reserved keyword. You can use the string as an identifier if the property name is a reserved keyword:

var $el = $('<div/>', {
   'class': 'class-1 class-2'
});