dynamic load with jquery

[NukeULater]

Hello,

I am working on a website which dynamically loads content in order to swap between three slideshows. I am using this jquery script to run the slideshow.

http://buildinternet.com/project/supersized/

This code dynamically loads the three slideshows.

$(document).ready(function() {
        //initial 
      $('#content').load('content/pbr.php');               
        
        
        menu clicks
        $('ul#navbar li a').click(function() {
        var page = $(this).attr('href');
        $('#content').load('content/' + page + '.php');
        return false;                        
        });
});

The problem that I am having, is that once the three supersize scripts have been activated they run all at the same time instead of updating or closing the previously opened script. Thus, the slideshow runs incorrectly.

What do I need to include in my loading script that would turn off the already running scripts?

Any help is appreciated.

 

[mrgstiffler]

Before you load the new content, you could do:

$('#content').html('');

Or something like this would prolly be better:

$.ajax({
  url: 'content/' + page + '.php',
  datatype: 'html',
  success: function(data) {
    $('#content').html(data);
  },
  error: function(error) {
    console.log(error);
  }
});