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>

Answer 1

You can use replaceAll() method:

$flexBox.replaceAll(".overlayBox");​

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