Google Maps JS-API not working on 2nd call

Google Maps JS-API not working on 2nd call

Hi

I have 2 pages, let's call them "a" and "b".
Page a calls b per AJAX (as default in jQM) with a parameter "id". Page b loads data dependent on the id.

On page a, I have the Google-Maps init-script:

  1. function initializeMap(lat, lng, id) {
              var latlng = new google.maps.LatLng(lat, lng);
              var myOptions = {
                zoom: 14,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
              };
              var map = new google.maps.Map(document.getElementById("map_canvas"+id), myOptions);
              var marker = new google.maps.Marker({
                  position: latlng,
                  map: map,
                  title:"asd"+id
              }); 
     












Now on page b, there is my DIV to display the map:
 <div id="map_canvas<?php echo ($id); ?>" style="width:100%; height:100%"></div>
    <script>
       initializeMap(<?php echo ($lat); ?>,<?php echo ($long); ?>,<?php echo ($>id); ?>);
    </script>


On page a, there are several links to b:

<a href="b.php?id=1">1</a>
<a href="b.php?id=2">2</a>
<a href="b.php?id=3">3</a>

Now the problem: Whatever link get's clicked first will work. The map displays perfect. When you hit the back button to click any other link to "b" with a different id, the map doesn't work anymore.

What is wrong? Please help ASAP, I'm turning nuts...

I see this error on page b, even on first load:
"n.animationComplete(function () {n.removeClass("in");}) is undefined"

Thanks
Raphael