Dicas de criação de jQuery DOM

Eu quero compartilhar um pequeno truque legal com a criação de jQuery DOM.

Costumo ver scripts jQuery criar elementos DOM como este:

var $elem = $('<div class="' + class_var + '">' + text + '</div>');
// OR
var $elem = $("<div>").addClass('some-class').text("text content");

Não há nada de errado com os métodos acima, mas você pode realmente passar um objeto para estender o elemento que está sendo criado da seguinte maneira:

var $elem = $('<div/>', {
"class" : "some-class",
"attr" : "value",
"text" : "text content", // equivalent to .text()
"html" : "<h3>title</h3>", // equivalent to .html()
"click" : function() { } // click event
});

Usando este método, você pode criar um DOM usando um objeto predefinido e ficar longe de concatenações de string desagradáveis.