克隆內容w /來自具有相同類別的元素的JavaScript

Question

我的JavaScript知識很少，並且已經負責將DIV中的H2和P複製到另一個DIV中，並將其顯示在懸停上。請看看我在這裏試圖做什麼：http://dev.surgeryatnmc.org/surgical-services/。

我想克隆從.orig到.hover，它是有點工作，但在每個工具提示而不是單獨顯示所有三個活的項目。

這裏是我的列表項：

<ul> 
    <li class="lactrimal1"> 
       <div class="orig"> 
        <h2>Lactrimal Duct Probe</h2> 
        <p>Helps patient regain use of their tear ducts in this quick procedure.</p> 
       </div>      
       <div class="img"> 
        <div class="txt hover"></div> 
       </div> 
      </li> 
      <li class="cataracts2"> 
       <div class="orig"> 
        <h2>Cataracts</h2> 
        <p>We replace the eye's natural lens which has become clouded by cataract with an artificial lens.</p> 
       </div> 
       <div class="img"> 
        <div class="txt hover"></div> 
       </div> 
      </li> 
      <li class="sinus3"> 
       <div class="orig"> 
        <h2>Endoscopic Sinus Surgery</h2> 
        <p>A procedure used to remove blockages in the sinuses to allow for efficient pain-free breathing.</p> 
       </div> 
       <div class="img"> 
        <div class="txt hover"></div> 
       </div> 
      </li> 
</ul> 

這裏是我的腳本：

$('div.orig', this).each(function() { 
    $(this).clone().appendTo('div.hover'); 
}); 

我也試過，但它只是克隆的第一個項目：

$(".hover").html($('.orig').html()); 

任何幫助表示感謝，謝謝大家！

所有的答案都奏效了，我沒有意識到可能有這麼多解決方案來解決這個問題。謝謝你的幫助！

Answer 1

$('div.orig').each(function() { 
    $(this).parent().find('.txt').html($(this).html()); 
}); 

Answer 2

嘗試這樣的事情

編輯： 其實你要做的，像這樣得到的元素

$('div.orig').each(function() { 
    var jThis = $(this); 
    jThis.parent().find('.hover').html(jThis.html()); 
}); 

Answer 3

$('.orig', this).each(function() { 
    $(this).next('.img').children('.hover').html($(this).html()); 
}); 
​ 

FIDDLE

Answer 4

anpother解決方案 - >

$(document).ready(function(){ 
$('div.orig', this).each(function(i,e) { 
    $(this).clone().appendTo('div.hover:eq(' + i + ')'); 
}); 
})​