Restore Multiple Detached Elements in JQuery

Question

I have a link inside of a table that, when clicked, removes the entire parent tr. I am using detach() for the purposes of restoring that item later based on an event.

Typically, one would store this as a variable, then recall it later and have it append() later, but what if I need to restore multiple rows?

There is no .= method to add more to a variable is there?

JSFiddle = http://jsfiddle.net/nErDy/

Answer 1

Why not use an array?

var deleted = [];
//Allow people to delete rows
$('a.delete').click(function() {
    deleted.push($(this).parent().parent().detach());
});

//Restore all
$('a.restore').click(function() {
    $.each(deleted, function(i, v) {
        $('#teams').append(v);
    });
});​

http://jsfiddle.net/wirey00/nErDy/2/

Answer 2

you should use an array to store all the dettached items: http://jsfiddle.net/nErDy/1/

Answer 3

What everyone else said, use an array. Also, move the css for odd rows into an actual css, so it respects the deleted rows.

#teams tr:nth-child(even) td { background-color : #cecece }​

http://jsfiddle.net/44Qab/