I need to move the each of the h3 elements from their position below to a new position as first child of .summary-inside-wrapper
Everything I have tried moves an instance of ALL the h3 elements into each summary. I need for only the original within each summary to be moved.
<div class="content-main">
<div class="summary" id="listing_summary_3547">
<div class="share"></div>
<div class="summary-inside-wrapper">
<div class="summary-inside"> <---- TO HERE ---|
<div class="left"> |
<div class="title"> |
<h3>unique text here 1</h3> -- MOVE THIS h3 ---|
<p>some other text here</p>
</div>
</div>
<div class="right"></div>
</div>
</div>
</div>
<div class="summary" id="listing_summary_45741">
<div class="share"></div>
<div class="summary-inside-wrapper">
<div class="summary-inside"> <---- TO HERE ---|
<div class="left"> |
<div class="title"> |
<h3>unique text here 1</h3> --and MOVE THIS h3 ---|
<p>some other text here</p>
</div>
</div>
<div class="right"></div>
</div>
</div>
</div>
<div class="summary" id="listing_summary_6">
<div class="share"></div>
<div class="summary-inside-wrapper">
<div class="summary-inside"> <---- TO HERE ---|
<div class="left"> |
<div class="title"> |
<h3>unique text here 1</h3> --and MOVE THIS h3 ---|
<p>some other text here</p>
</div>
</div>
<div class="right"></div>
</div>
</div>
</div>
</div>
I have tried insertBefore(), prepend() and many more without the desired results. Each time I get copies of EVERY h3 inside each instance of the summary.
Code:
$(".title h3").each(function()
{
var item=$(this);
var parentContainer=item.parents(".summary-inside");
item.remove();
parentContainer.prepend(item);
});
here is a Live Demo
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