jquery - 選択したオプションIDでのGoogle gmapの更新

Question

オプション「id」を使用して、データベースからアップロードされた選択リストに応じて、マップのGoogle位置を更新して表示したいと思います。期待される結果に近づいていると思いますが、問題の原因はまだわかりません。現在の結果は、gmap_city は空のままです。

<select id="city_list">
<option selected="selected" id="40.7305991000,-73.9865812000" value="2">New York, United States</option>
// here is a query that display the following options
<option id="<?php echo $latlng;?>" value="<?php echo $id;?>"><?php echo $name;?</option>    
</select>


<script>
$('#city_list').change(function(){
    var coordinate = $(this).attr('id');
    google_map(coordinate);
});

function google_map(coordinate){
var latlng = new google.maps.LatLng(coordinate);
var mapOptions = {
    zoom: 11,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('gmap_city'),
    mapOptions);
} 
</script>

<div id="gmap_city" style="margin-left:15px; margin-top:3px; width:540px; height:220px; border:5px solid white;"></div>

助けてくれてありがとう