JQuery .data () no funciona?

Recientemente estaba codificando y me encontré con un problema extraño. Intenté asignar un atributo de datos a un nuevo elemento que había creado (a través de jQuery), solo para descubrir que en realidad no asignaría el atributo. Consulte el siguiente enlace para ver un ejemplo, el código se enumera a continuación:

http://jsfiddle.net/y95p100c/1/

¿Alguna idea de por qué está sucediendo esto? Nunca me he encontrado con esto ...

var div = $("<div />")
$(div).data("foo", "bar")
console.log($(div)[0].outerHTML) // prints <div></div>

Respuestas a la pregunta(2)

Su respuesta a la pregunta