Tại sao điều này chỉ được nối thêm một lần?

Question

Vòng lặp này (xem jsfiddle) cố gắng thêm một thẻ <span> vào vùng chứa năm lần. Nhưng nó chỉ làm điều đó một lần. Tại sao?

var myArr = [0,1,2,3,4]; 
var $span= $('<span></span>'); 
for (var i = 0; i < (myArr.length); i++) { 
    $('.contain').append($span); 
} 

Answer 1

Vấn đề là bạn đang thêm cùng một yếu tố nhiều lần.
Sử dụng clone để sao chép phần tử và sau đó append.

$('.contain').append($span.clone());

demo

Cập nhật:

Bằng cách này bạn có thể tùy chỉnh các yếu tố của bạn và sau đó sao chép nó với tất cả tài sản.

var $span = $('<span/>', { 
        'class': 'someClass otherClass', 
        'css': { 
         'background-color': '#FF0000' 
        } 
      }); 
for (var i = 0; i < (myArr.length); i++) { 
    $('.contain').append($span.clone()); 
} 

demo2

Update2: theo this nhận xét.

$('.contain').append('<span class="yourClass"/>');