What is a simple way to duplicate every element in a class as a sibling? For example, it should change this HTML:
<body>
<div>
<h1> Foos </h1>
<span class='duplicate-me'> foo </span>
</div>
<div>
<h1> Bars </h1>
<span class='duplicate-me'> bar </span>
</div>
</body>
into:
<body>
<div>
<h1> Foos </h1>
<span class='duplicate-me'> foo </span>
<span class='duplicate-me'> foo </span>
</div>
<div>
<h1> Bars </h1>
<span class='duplicate-me'> bar </span>
<span class='duplicate-me'> bar </span>
</div>
</body>
Thanks
$('.duplicate-me').after(function() {
return $(this).clone();
});
Use the after method from jQuery and call the clone method in the function you are passing to it.
References: http://api.jquery.com/after/
http://api.jquery.com/clone/
Example: https://jsfiddle.net/2y6cqLrq/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With