Search code examples
javascriptfor-loophtml-selectappendchild

Only last select element gets the option elements


I am trying to make a code that adds all the item options to each select element. For some reason only the last select element gets the options.
Here is the code:

for (var i=0; i<itemcount; i++) {
    var newE=document.createElement("span");
    var newD=document.createElement("input");
    var newS=document.createElement("select");
    newE.id="itemcontainer";
    newD.id="drop"+i;
    newS.id="sel"+i;
    for (var j=0; j<itemos.length; j++) {
        newS.appendChild(itemos[j]);
    }
    newD.type="checkbox";
    newD.name="drop";
    newE.appendChild(newD);
    newE.appendChild(document.createTextNode("Drop? "));
    newE.appendChild(newS);
    container.appendChild(newE);
    container.appendChild(document.createElement("br"));
}

What is wrong?


Solution

  • A single <option> element can only be in one <select> at a time. You're trying to add the same options to many different <select> lists, and that can't work.

    You have to create new <option> elements for each <select>.