Question

In the HTML below, I would like to copy the “submittedby” beside “message”, within the H2 tag:

<div class="comment">
<H2 class="threadtitle">Message 1</h2>
<span class="submittedby">James</a>
</div>

<div class="comment">
<H2 class="threadtitle">Message 2</h2>
<span class="submittedby">Bill</a>
</div>

<div class="comment">
<H2 class="threadtitle">Message 3</h2>
<div class="submittedby">Phil</a>
</div>

My current jQuery code is as follows:

$(document).ready(function() { 
    $('.submittedby').copy().appendTo('.threadtitle');
});

The problem is this copies EVERY “submittedby” to EVERY “threadtitle”. How do I code it so it only copies the “submittedby” from within the same “comment” div?
Thanks!

Answer 1

Use .each() here, like this:

$(function(){ 
  $('.submittedby').each(function() {
    $(this).clone().appendTo($(this).siblings('.threadtitle'));
  });
});

This loops over each .submittedby element, and moved it around with respect to the current .submittedby you’re on in the loop, so each one’s handled individually. Also I assumed you meant .clone() here, but if you’re actually using the .copy() plugin, just replace .clone() with .copy() in the code above.