append method will not work in jquery - jquery-mobile

Question

I have create JSON. and I have working in jquery mobile, This will not work in my code. Code is executed but element will not append.
var serviceName= [{..},{..},{..}]
$('#service_select').empty();
$('#service_select').append('<select name="day" id="day">');
for(var i = 0; i < serviceName.length; i++ ){
$('#service_select').append('<option value=" '+ serviceName[i].name+'">'+serviceName[i].name+'</option>');
}
$('#service_select').append('</select>');
html code
<div id="service_select"></div>

Answer 1

First ,Close select tags and append it to service_select DIV ,Then append option to it ,Because evenif you dont specify,jQuery creates closing tags immediately for if you dont specify
//NEW CODE just copy paste
<script>
var serviceName= [1,3,5,7,9];
$('#service_select').empty();
$("#service_select").append('<select name="day" id="day"></select>');
for(var i = 0; i < serviceName.length; i++ ){
$("#service_select select").append(new Option(serviceName[i], serviceName[i]));
}
</script>
Check jsfiddeel http://jsfiddle.net/TfM9S/

Answer 2

This is because the first append() creates the closing </select>, too. jQuery will not create invalid html.
try this:
$('#service_select').empty();
$('#service_select').append('<select name="day" id="day"></select>');
for(var i = 0; i < serviceName.length; i++ ){
$('#service_select select').append('<option value=" '+ serviceName[i].name+'">'+serviceName[i].name+'</option>');
}

Answer 3

It is suggested to use this form:
var $selectElement = $('<select>', {
'name': 'day',
'id': 'day'
});
for(var i = 0; i < serviceName.length; i++ ){
var $optionEl = $('<option>', {
'value': serviceName[i].name,
'text': serviceName[i].name
});
$selectElement.append($optionEl);
}

Answer 4

It works Properly
var serviceName = [{..},{..}]
$(document).on("pageinit","#anotherPageId", function(){
$('#service_select').empty();
$('#service_select').append('<select name="service" id="service"></select>');
for (var i = 0; i < serviceName.length; i++) {
$('#service_select select').append('<option value=" ' + serviceName[i].name + '">' + serviceName[i].name + '</option>');
}
});