How do I move identical elements from one div to another with jQuery?

Question

With the example below, I'd like to select the contents of the < h3 > tags for each block, and move them inside the 'title' divs (without the h3 tags). Is this possible?

<div id="block1">
  <div class="title">
  </div>
  <div class="content">
    <h3>Title 1</h3>
  </div>
</div>

<div id="block2">
  <div class="title">
  </div>
  <div class="content">
    <h3>Title 2</h3>
  </div>
</div>

Answer 1

Online demo: http://jsbin.com/ezuxo

// Cycle through each <div class="content"></div>
$(".content").each(function(){
  // Find its first h3 tag, and remove it
  var heading = $("h3", this).remove();
  // Set the text of the h3 tag to the value of the previous div (.title)
  $(this).prev().html($(heading).html());
});

Answer 2

First off, I'd assign a class to the "blocks", let's call it "block" for now. Then do this:

$(".block").each(function() {
  $(".title", this).html($(".content h3", this).html());
}