javascript - Using jquery append to add option values into a select element not working -

i'm looking dynamically populate select element names of items stored array.

for reason it's not working , i'm not sure why.

html:

<div class="col-md-4 col-md-offset-4">     <select class="select1">     </select>         ,     <select class="select2">     </select> </div> 

note i'm using bootstrap layout.

here's jquery i'm using try , populate ".select1"

jquery:

select: function() {     $.each(state.greens, function(index, value) {         $(".select1").append("<option value =' " + index + " '>" + state.greens[index].name + "</option>");     }); } 

note function 'select' stored within object called 'display'.

state.greens name of array i'm trying access.

so @ end of html page call display.select(); call function.

no error messages showing in console.

also, saw question: appending options select using jquery doesn't work

but looking jquery centric answer , seems ought work.

you can in way:

$.each(state.greens, function(index, value) {     $('.select1').append($('<option>', {         value: index ,         text: state.greens[index].name     })); });