Google Map Jquery.load Problem

Hey trying to load my google map through a jquery load call… doesn’t seem to be loading on to my div on my index page through an external page.. had the code from the google developers page.. but cant seem to get it to work.. any help or pointers
that would be great…

[CODE]

$(‘#content’).on(‘click’, ‘nav ul li a’, function() {

var page = $(this).attr(‘href’);
// Script to fade and show pages
$(‘#content’).hide().load(‘page/’ + page + ‘.php’).fadeIn(‘normal’, function() {

function initialize() {
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(-34.397, 150.644),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById(“map-canvas”), mapOptions);
}

function loadScript() {
var script = document.createElement(“script”);
script.type = “text/javascript”;
script.src = “http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=TRUE_OR_FALSE&callback=initialize”;
document.body.appendChild(script);
}

window.onload = loadScript;
});
});
});

[/CODE]

Also in #JavaScript _↴