Why does this only work in Firefox?

Question

I created a self-contained example to find out why this only works in Firefox:

var ul = jQuery('<ul></ul>');

jQuery(selector).children().each(function() {
   var li = jQuery('<li></li>');
   var label = '<label for="' + this.id + '">' + this.name + '</label>';
   li.append(label);
   li.append(this);
   ul.append(li);
});

Any web browser browser or even IE does not work on this line:

li.append(this);

this is an HTMLInputElement. Any ideas?

Thanks Pete

Answer 1

The problem is that "this" is a DOM node already in some place. You cannot move DOM nodes around that are already somewhere without first deleting or copying.

If you want to:

• move it you have to do

  li.append ($ (this) .remove ())

• copy it you will do

  li.append ($ (this) .clone (true))

, , FF. , FF.

,

Answer 2

, , , jQuery, .

1.3.2 ( ), FF 3, IE 8 Chrome.