jQuery replace multiple elements using class

Question

I want to replace all the spans with a div. When I run this code only one element gets replaced. How to change this code so that the script affects all the spans?

I have tried to use clone(), but it didn't work.

$flexBox = $("<div></div>");
$(".overlayBox").replaceWith($flexBox);

<span class="overlayBox"></span>
<span class="overlayBox"></span>
<span class="overlayBox"></span>

VisioN · Accepted Answer · 2012-06-05 19:22:32Z

5

You can use replaceAll() method:

$flexBox.replaceAll(".overlayBox");

DEMO: http://jsfiddle.net/4VHVC/

answered Jun 5, 2012 at 19:22

VisioN

146k35 gold badges287 silver badges291 bronze badges

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

9 Comments

Registered User Over a year ago

Your solution doesn't work at all, even the first element doesn't get replaced.

VisioN Over a year ago

@RegisteredUser It works if you write it like vice versa. Check the demo from the answer.

VisioN Over a year ago

@RegisteredUser Do you check DEMO from the answer? Mine works perfectly. div blocks are displayed in red.

Selvakumar Arumugam Over a year ago

@RegisteredUser Tested and it worked fine in FF12, Chrome and IE 7.

Registered User Over a year ago

Sure the demo works, but the code fails to work inside my app

|

Collectives™ on Stack Overflow

jQuery replace multiple elements using class

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related