javascript - Looping through an array of nodes and appending a child to each one only appends to the last element -

i want loop through array of nodes referring svg elements , append text element each 1 reason of text appears in last svg element in array.

here's code

var svgs = document.getelementsbytagname('svg');  var modulenames = ["1", "2", "3", "4", "5"]; var textel = document.createelementns(svgns, 'text');  var = 1;  while(i < modulenames.length) {    textnode = document.createtextnode( modulenames[i] );   textel.appendchild(textnode);   svgs[i].appendchild(textel);    i++;  } 

oh, , before know number of svg elements same length modulenames array.

thanks!

text appears in last svg element

not in last svg <text> element, in only one. you're creating single element , keep appending text nodes it. appending same element different parents doesn't clone it, move it.

you want create multiple elements:

var modulenames = ["1", "2", "3", "4", "5"]; (var i=0; < modulenames.length; i++) {     var textel = document.createelementns(svgns, 'text'),         textnode = document.createtextnode( modulenames[i] );     textel.appendchild(textnode);     svgs[i].appendchild(textel); }