title: Bootstrap 2 Modal .removeData
body: <p>I have a map script using the gmap3 plugin and am sorting out how to implement a modal when a marker is clicked on. Everything is working ok except the when I click on a new marker, my script is loading the string from the previous markers clicked. I placed .removeData in the script, but it does not seem to be working.</p>
  
  <p>here is the script:</p>
  
  <pre><code>&lt;script&gt;
  $('#map_canvas').gmap3({
    map:{
      options:{ 
        streetViewControl: false,
        mapTypeId: google.maps.MapTypeId.TERRAIN,
        mapTypeControl: true,
        mapTypeControlOptions: {
          style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
        },
      }
    },
    marker:{
      values:[
          &lt;!-- TMPL_LOOP Listings --&gt;
              &lt;!-- TMPL_IF have_geocode --&gt;
                  {latLng:[&lt;!-- TMPL_VAR latitude --&gt;, &lt;!-- TMPL_VAR longitude --&gt;],data:'&lt;div class="modal-body"&gt;&lt;/div&gt;&lt;div class="modal-footer"&gt;&lt;a href="/property/detail/&lt;!-- TMPL_VAR listing_id --&gt;" class="btn btn-small btn-primary" target="_self"&gt;View Details&lt;/a&gt;&lt;/div&gt;',options:{icon: "/static/images/mapmarker.png"}},
              &lt;!-- TMPL_ELSE --&gt;
                  {address:"&lt;!-- TMPL_VAR street_no --&gt; &lt;!-- TMPL_VAR street --&gt;, &lt;!-- TMPL_VAR city --&gt;, &lt;!-- TMPL_VAR state --&gt; &lt;!-- TMPL_VAR zip --&gt;",data:'&lt;div class="modal-body"&gt;&lt;/div&gt;&lt;div class="modal-footer"&gt;&lt;a href="/property/detail/&lt;!-- TMPL_VAR listing_id --&gt;" class="btn btn-small btn-primary" target="_self"&gt;View Details&lt;/a&gt;&lt;/div&gt;',options:{icon: "/static/images/mapmarker.png"}},
              &lt;!-- /TMPL_IF --&gt;
          &lt;!-- /TMPL_LOOP --&gt;
      ],
      options:{
        draggable: false
      },
      events:{
          click: function(marker, event, context){
              $('#mapModal').on('hidden', function() {
                  $(this).removeData('modal');
              });
              $('#mapModal').append('&lt;div class="modal-body"&gt;&lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt;×&lt;/button&gt;'+(context.data)+'&lt;/div&gt;');
              $('#mapModal').modal('show')
              $(this).gmap3('get').panTo(marker.getPosition());
          },
      },
    },
    autofit:{},
  });
  </code></pre>
  
  <p></p>
  
  <p>and the modal container:</p>
  
  <pre><code>&lt;div id="mapModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="mapModalLabel" aria-hidden="true"&gt;&lt;/div&gt;
  </code></pre>