jQuery Replace One Div with Another

Question

I need to replace one div with another and also i need another container to be removed. Please, see my code:

<a id="load-more" href="#">
<div class="text">Load more</div>
<div id="infscr-loading">
<img alt="Loading..." src="../loading_small.gif" style="display: none; ">
<div">No more posts to load</div>
</div>
</a>

I need this:

<span class="text">Load more</span>

replace with this:

<div">No more posts to load</div>

So, my result should be:

<a id="load-more" href="#">
<div">No more posts to load</div>
<div id="infscr-loading">
<img alt="Loading..." src="../loading_small.gif" style="display: none; ">
</div>
</a>

It's possible to do?

Yes, it's possible. What have you tried?

iambriansreed
– iambriansreed

2012-07-19 19:55:42 +00:00
Commented Jul 19, 2012 at 19:55 — iambriansreed
– iambriansreed, Commented Jul 19, 2012 at 19:55

Alnitak · Accepted Answer · 2012-07-19 19:56:07Z

6

Did you try:

$('.text').replaceWith(...);

Docs at http://api.jquery.com/replaceWith/

answered Jul 19, 2012 at 19:56

Alnitak

341k72 gold badges420 silver badges503 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

MikkolidisMedius · Accepted Answer · 2012-07-19 20:08:51Z

1

Your markup has an error in the <div"> tag, probably you accidentally removed the class name or id. I'll assume the replacement div has an id attribute.

To change the contents of the <div class="text"> bit you need to do:

$('div.text').replaceWith($('#replacement'));

This both eliminates the text div and moves the #replacement div to the position of the text div.

answered Jul 19, 2012 at 20:08

MikkolidisMedius

4,8421 gold badge27 silver badges20 bronze badges

Comments

Uday Hiwarale · Accepted Answer · 2014-01-07 15:09:08Z

1

$('div.text').replaceWith($('#replacement').html());

answered Jan 7, 2014 at 15:09

Uday Hiwarale

4,1876 gold badges49 silver badges51 bronze badges

Collectives™ on Stack Overflow

jQuery Replace One Div with Another

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related