remove()
Removes the current element or each element in a set from the DOM.
This function returns a new result set containing each removed element. These can be changed and inserted in the document. This could be beneficial in terms of performance, as manipulating elements inside the DOM is relatively time consuming.
Examples
This script removes all Span elements found in the template.
Copy
results.remove();
| Selector | Paragraph before script execution | Paragraph after script execution |
|---|---|---|
| span | <p>Lorem ipsum <span>dolor sit</span> amet, consectetuer adipiscing elit.</p> | <p>Lorem ipsum amet, consectetuer adipiscing elit.</p> |
The selector of the following sample script is tbody. Before this script runs, the table body
consists of a single placeholder row with three cells. After running the script, it contains thirty rows. To improve performance, most
of the DOM manipulation takes place on detached elements.
Copy
// Detach the placeholder row from the DOM
var row = query("tr", results).remove();
// Modify the cells of this row
var cells = row.children();
cells[0].html("some text").css("background-color", "yellow");
cells[1].html("some text").css("font-weight", "bold");
cells[2].html("some text");
// Create a number of copies
var rows = row.clone();
for (var i = 0; i < 30; i++) {
rows = rows.add(row.clone());
}
// Attach all copies to the DOM as children of tbody
results.append(rows);