JQuery克隆每個列表行的最後一個元素

Question

我試圖克隆每個列表行的最後一個元素。我可以克隆行（在這種情況下，我需要克隆第一個元素），但是我無法從每個li克隆最後的span。以下是我迄今爲止：

HTML：

<ul class="elements"> 
    <li> 
     <span>Span 1</span> 
     <span>Span 2</span> 
     <span>Span 3</span> 
    </li> 
    <li> 
     <span>Span 4</span> 
     <span>Span 5</span> 
     <span>Span 6</span> 
    </li> 
</ul> 
<a href="#" class="new_row">Add new row</a> 
<a href="#" class="new_column">Add new column</a> 

JQuery的：

$('.new_row').click(function(e) { 
    e.preventDefault(); 
    var ul = $(this).prev('.elements'); 

    var new_data= $("li", ul).eq(0).clone(); 
    new_data.appendTo(ul); 
}); 
$('.new_column').click(function(e) { 
    e.preventDefault(); 
    $('li').each(function(){ 
     $('span:last').clone(); 
    }); 
}); 

的jsfiddle：http://jsfiddle.net/vPDpH/

我希望得到任何幫助。預先感謝。

Answer 1

你克隆元素，但沒有做任何事的..

你也需要克隆的最後一個跨度電流I的情況下。否則，將克隆的HTML的最後跨度不論它是

$('.new_row').click(function(e) { 
    e.preventDefault(); 
    var ul = $(this).prev('.elements'); 

    var new_data= $("li", ul).eq(0).clone(); 
    new_data.appendTo(ul); 
}); 
$('.new_column').click(function(e) { 
    e.preventDefault(); 
    $('li').each(function(){ 
     var new_data= $('span:last', this).clone(); 
     new_data.appendTo(this); 
    }); 
}); 

Check Fiddle

Answer 2

另一種

的Javascript

$(".new_row").click(function (e) { 
    e.preventDefault(); 
    var elements = $(e.target).siblings(".elements").first(); 

    elements.append($("li", elements).first().clone()); 
}); 

$(".new_column").click(function (e) { 
    e.preventDefault(); 
    $("li", $(e.target).siblings(".elements").first()).each(function (index, element) { 
     $(element).append($("span", element).last().clone()); 
    }); 
}); 

在jsfiddle