I'm sorting a table using jQuery, roughly following the code found here. The code sketch is as follows:
// cache objects
$table = $('#sort-table'), // cache the target table DOM element
$rows = $('tbody > tr', $table); // cache rows from target table body
// sort items
// assign to table - what is going on?
$table.append(row); // <-- how come $table remains the same size?
This is simply how the DOM works. You can't have an element in two different places. If an element is already in a document and you put it somewhere else, it will be moved from its current position. It is, I suppose, a little like a Set, but that is not how it is specified. So it's not removing duplicate objects, because there never are duplicate objects: it's simply moving the same object, which can only exist in one place.
Node.appendChild()method adds a node to the end of the list of children of a specified parent node. If the given child is a reference to an existing node in the document,
appendChild()moves it from its current position to the new position (there is no requirement to remove the node from its parent node before appending it to some other node).