.replaceAll() JQ Home  <<  Manipulation  <<  .replaceAll()

DOM replacement.

Description

The .replaceAll() method is used to replace the specified target elements with the matched set.

  • When replacing content with other existing content, the existing content replaces the target by being moved from its old location, not by being cloned.

Syntax

Signature Description
.replaceAll( target )Replace the specified target elements with the matched set.

Parameters

Parameter Description Type
target A selector expression indicating which element(s) to replace.Selector

Return

A jQuery object containing the new matched set of elements.

.replaceAll( target ) Examples Manip.  <<  Top

Replace the specified target elements with the matched set.

In the example below when the left button is pressed we replace all 'td' elements.

When the right button is pressed we replace the table row with an id of 'trid1' with the table row with an id of 'trid3. Notice how the table row is moved and not cloned as described in the description above.

Table1 For Testing The .replaceAll( target ) Signature
Table Row 1, Table Data 1 Table Row 1, Table Data 2
Table Row 2, Table Data 1 Table Row 2, Table Data 2

Table2 For Testing The .replaceAll( target ) Signature
Table Row 1 (id of trid1), Table Data 1 Table Row 1 (id of trid1), Table Data 2
Table Row 2, Table Data 1 Table Row 2, Table Data 2
Table Row 3 (id of trid2), Table Data 1 Table Row 3 (id of trid2), Table Data 2


$(function(){
  $('#btn7').on('click', function() {
    $('new content').replaceAll('.testtable td'); 
  });
  
  $('#btn8').on('click', function() {
    $('#trid2').replaceAll('#trid1'); 
  });
});

Press the button below to action the above code:

            

Related Tutorials

jQuery Intermediate Tutorials - Lesson 5 - DOM Removal & Replacement