Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

Tags:

html

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)

like image 243
alexchenco Avatar asked Dec 22 '22 09:12

alexchenco


1 Answers

$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/

like image 140
Rafay Avatar answered Feb 25 '23 10:02

Rafay