Moving a span element from one div to another with jQuery?

I want to move (on page load) the <span>votes</span> part at the bottom and place it inside the .rating-result div:

<div class="topic-like-count average">
 <h4>
  <div style="display: none">UN:F [1.9.10_1130]</div>
  <div class="thumblock ">
   <span class="rating-result">
     <div id="gdsr_thumb_text_43_a" class="gdt-size-20 gdthumbtext">0</div>
  </span>
  <div class="ratingtext ">
  </div>
  <div class="raterclear"></div>
  </div>
 </h4>
<span>votes</span>
</div>

So that the final result looks like this:

<div class="topic-like-count average">
 <h4>
  <div style="display: none">UN:F [1.9.10_1130]</div>
  <div class="thumblock ">
   <span class="rating-result">
     <div id="gdsr_thumb_text_43_a" class="gdt-size-20 gdthumbtext">0</div>
     <span>votes</span>
  </span>
  <div class="ratingtext ">
  </div>
  <div class="raterclear"></div>
  </div>
 </h4>
</div>

How to accomplish that with jQuery?

EDIT:

Forgot to mention that where is more than one .topic-like-count div (for example):

<div class="topic-like-count good">
 <h4>
  <div style="display: none">UN:F [1.9.10_1130]</div>
  <div class="thumblock ">
   <span class="rating-result">
     <div id="gdsr_thumb_text_43_a" class="gdt-size-20 gdthumbtext">1</div>
  </span>
  <div class="ratingtext ">
  </div>
  <div class="raterclear"></div>
  </div>
 </h4>
<span>votes</span>
</div>

<div class="topic-like-count average">
 <h4>
  <div style="display: none">UN:F [1.9.10_1130]</div>
  <div class="thumblock ">
   <span class="rating-result">
     <div id="gdsr_thumb_text_43_a" class="gdt-size-20 gdthumbtext">0</div>
  </span>
  <div class="ratingtext ">
  </div>
  <div class="raterclear"></div>
  </div>
 </h4>
<span>votes</span>
</div>

(I think I need to use ($this) somewhere)


$span=$("#votes").clone();
$("#votes").remove();
$("#gdsr_thumb_text_43_a").append($span);

http://jsfiddle.net/dc47b/4/

EDIT

function doIt(){
    setTimeout(function(){
    $span=$("#votes").clone();
    $("#votes").remove();
    $("#gdsr_thumb_text_43_a").append($span);

    }, 1000);
}


window.onload = function() {
     doIt();

   };

http://jsfiddle.net/dc47b/5/

yet another edit

$(".topic-like-count").each(function(){

$span=$(this).find(".vote").clone();
    $(this).find(".vote").remove();
    $(this).find("#gdsr_thumb_text_43_a").append($span);

});

http://jsfiddle.net/BG7HC/1/

and

http://jsfiddle.net/dc47b/6/


$('.topic-like-count > span').appendTo('.rating-result');

克隆毫无意义,你只是在浪费周期。


Use the appendTo keyword.

Check out the SO answer How to move an element into another element?.

Also you could I guess use clone and then remove the original

To select the actual span in question use something like;

$(".topic-like-count:last-child")
链接地址: http://www.djcxy.com/p/42546.html

上一篇: 除去另一个div后的div并追加

下一篇: 用jQuery将span元素从一个div移动到另一个div?