Javascriptを使用してDOM構造内のブランチを正しくクローンして最後のノードを削除する方法

Question

私は左側と右側の2つのdivを持っています。 左側には5種類の画像が追加されています。私はこれらの5つを正しいものに複製し、それらを正しいノードに追加し、最後のノードを削除する必要があります。左の1のために

：右側のために

var LS = document.getElementById("left"); 

var number = 5; 
while(number > 0) 
{ 
    var theImage = document.createElement("img"); 
    LS.appendChild(theImage); 
    number--; 
} 

：

var RS = document.getElementById("right"); 
var leftImages = LS.cloneNode(true); 

RS.appendChild(leftImages); 

while(RS.lastChild!=null) 
{ 
    var noviCh = RS.lastChild; 
} 
RS.removeChild(noviCh); 

コードは動作しません。誰もが理由を知っている？

Answer 1

すべての画像を追加して削除する代わりに、最後の画像を追加しないでください。

var LS = document.getElementById("left"); 
 

 
for (var i = 0; i < 5; i += 1) { 
 
    var theImage = document.createElement("img"); 
 
    LS.appendChild(theImage); 
 
} 
 

 
var RS = document.getElementById("right"); 
 
var imgs = LS.getElementsByTagName('img'); 
 

 
for (var i = 0; i < imgs.length - 1; i += 1) { 
 
    RS.appendChild(imgs[i].cloneNode(true)); 
 
}

#left { 
 
    background-color: yellow; 
 
} 
 

 
#right { 
 
    background-color: green; 
 
} 
 

 
img { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: red; 
 
}

<div id="left"></div> 
 
<div id="right"></div>

Answer 2

var LS = document.getElementById("left"); 

for (var number = 5; number > 0; number--) 
{ 
    LS.appendChild(document.createElement("img")); 
} 

と

var RS = document.getElementById("right"); 

while(LS.lastChild) 
{ 
    RS.appendChild(LS.lastChild.cloneNode(true)); 
    LS.removeChild(LS.lastChild); 
}