var $optionTpl = $("<option></option>"); creates an element once, then inside the loop you just keep moving that same element and just giving it a new value.

Create multiple elements inside the loop instead

var $select = $(".js-select"); var ioSensors = [1,2,3]; for( var i = 0; i < ioSensors.length; i++ ){ var $optionTpl = $("<option></option>"); if(i === 0){ $optionTpl.val('').text('None').appendTo($select); } else {   $optionTpl.val(ioSensors[i]-1).text(ioSensors[i]).appendTo($select);  } } 

var $optionTpl = $("<option></option>"); creates an element once, then inside the loop you just keep moving that same element and just giving it a new value.

Create multiple elements inside the loop instead

var $select = $(".js-select"); var ioSensors = [1,2,3]; for( var i = 0; i < ioSensors.length; i++ ){ var $optionTpl = $("<option></option>"); if(i === 0){ $optionTpl.val('').text('None').appendTo($select); }    $optionTpl.val(ioSensors[i]-1).text(ioSensors[i]).appendTo($select); }