first loading content, than the toggl effect

first loading content, than the toggl effect

using the code below it will load some content into a div and will display it with a nice toggle effect. when i click the gm button it will load a google maps into the extra div. when i hit the yt button it will load an youtube movie into the extra div.

but when a google map is displayed, and a user clicks the yt button it has to toggle (hidden) the extra div first, then load the content, and in the end it has to toggle the div again.

but now it's loading the content, toggle the div (hidden), and then toggle it again...

  1. $('.gm').bind({
  2.     click: function() {
  3.         var ext = $(this);
  4.         if (ext.parent('div').parent('div').next().css('display') == 'block') {
  5.             ext.parent('div').parent('div').next().slideToggle(2500);
  6.         }
  7.         $.get('http://daytrip.dev/search/gmaps.html', function(data) {
  8.             ext.parent('div').parent('div').next().html(data).slideToggle(2500);
  9.         });
  10.     }
  11. });
  12. $('.yt').bind({
  13.     click: function() {
  14.         var ext = $(this);
  15.         if (ext.parent('div').parent('div').next().css('display') == 'block') {
  16.             ext.parent('div').parent('div').next().slideToggle(2500);
  17.         }
  18.         $.get('http://daytrip.dev/search/youtube.html', function(data) {
  19.             ext.parent('div').parent('div').next().html(data).slideToggle(2500);
  20.         });
  21.     }
  22. });

adsf