Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

44 lines (44 sloc) 2.058 kB
<?xml version="1.0"?>
<entry type="method" name="replaceAll" return="jQuery">
<title>.replaceAll()</title>
<signature>
<added>1.2</added>
<argument name="target" type="Selector">
<desc>A selector expression indicating which element(s) to replace.</desc>
</argument>
</signature>
<desc>Replace each target element with the set of matched elements.</desc>
<longdesc>
<p>The <code>.replaceAll()</code> method is corollary to <code><a href="/replaceWith">.replaceWith()</a></code>, but with the source and target reversed. Consider this DOM structure:</p>
<pre><code>&lt;div class="container"&gt;
&lt;div class="inner first"&gt;Hello&lt;/div&gt;
&lt;div class="inner second"&gt;And&lt;/div&gt;
&lt;div class="inner third"&gt;Goodbye&lt;/div&gt;
&lt;/div&gt;</code></pre>
<p>We can create an element, then replace other elements with it:</p>
<pre><code>$('&lt;h2&gt;New heading&lt;/h2&gt;').replaceAll('.inner');</code></pre>
<p>This causes all of them to be replaced:</p>
<pre><code>&lt;div class="container"&gt;
&lt;h2&gt;New heading&lt;/h2&gt;
&lt;h2&gt;New heading&lt;/h2&gt;
&lt;h2&gt;New heading&lt;/h2&gt;
&lt;/div&gt;</code></pre>
<p>Or, we could select an element to use as the replacement:</p>
<pre><code>$('.first').replaceAll('.third');</code></pre>
<p>This results in the DOM structure:</p>
<pre><code>&lt;div class="container"&gt;
&lt;div class="inner second"&gt;And&lt;/div&gt;
&lt;div class="inner first"&gt;Hello&lt;/div&gt;
&lt;/div&gt;</code></pre>
<p>From this example, we can see that the selected element replaces the target by being moved from its old location, not by being cloned.</p>
</longdesc>
<example>
<desc>Replace all the paragraphs with bold words.</desc>
<code><![CDATA[$("<b>Paragraph. </b>").replaceAll("p"); // check replaceWith() examples]]></code>
<html><![CDATA[<p>Hello</p>
<p>cruel</p>
<p>World</p>]]></html>
</example>
<category slug="manipulation/dom-replacement"/>
<category slug="version/1.2"/>
</entry>
Jump to Line
Something went wrong with that request. Please try again.