How much does this mess up a browser?

Question

A friend of mine recently shared this with me:

$("*").append($("*")); // watch your browser eat itself

What exactly does this jQuery try to do? Does it result in an infinite loop, or does it just mangle the DOM by iteratively appending every element to every other element? I know that appending an element to a different one essentially moves it there from its current parent. But what would happen when it tries to append an element to itself? Does it simply error out and die, or skip that step and move on?

Answer 1

In both Chrome and FFX (didn't test in IE because I'm scared) I get a Hierarchy Request Error which happens when you try to append a node to itself or append to a null node, or a bunch of other similar reasons.

This means that logically it actually does go through the DOM tree and attempt to append others first .. the selector selects the same node twice and tries to append it to itself, which results in the error.