Multiple select box fill up: With jQuery

Use clone to dynamic options generation

by marifrahman

HTML

<select id="selct_1"></select>
<select id="selct_2"></select>
<select id="selct_3"></select>
<select id="selct_4"></select>
<select id="selct_5"></select>
<select id="selct_6"></select>
<select id="selct_7"></select>
<select id="selct_8"></select>
<select id="selct_9"></select>

JavaScript

var start = new Date().getTime();

var optList = [];
for (i = 0; i < 5000; i++) {
    optList.push("<option value ='" + i + "' >Options - " + i + "</option>");
}
var opt = optList.join("");
var elm = $("#selct_1").html(opt);
//alert(elm.innerHTML);

for (j = 2; j < 10; j++) {
    var copy = elm.clone(true);
    (copy).attr('id',"selct_" + j) ;
    $("#selct_" + j).replaceWith(copy);
}
var end = new Date().getTime();
var diff = end - start;
alert("Execution time: " + diff + "Ms");