Loading HTML inside div tags

I am making a slideshow system that would show previous & next buttons for the obvious jobs. The slides however will be seperate html files, like slide1.html, slide2.html. Thickbox and other plugins load html asynchronously within them. What is the best method to do this. I am writing a jQuery plugin fo开发者_如何学运维r the whole process.

I would love ideas from JavaScript experienced people.

Thanks a lot in advance. Appreciate all the help.

Not entirely sure what you're asking. It's dead easy to load HTML snippets into a div using load:

$("selector_for_the_div").load("your_url");

Example (live copy):

jQuery(function($) {

  var currentSlide = 0;
  var slides = [
    "http://jsbin.com/enuju4/",
    "http://jsbin.com/enuju4/2",
    "http://jsbin.com/enuju4/3"
    ];

  loadSlide(0);

  $("#btnNext").click(function() {
    loadSlide(currentSlide + 1);
  });

  $("#btnPrev").click(function() {
    loadSlide(currentSlide - 1);
  });

  function loadSlide(index) {
    if (index >= 0 && index < slides.length) {
      currentSlide = index;
      $('#slideHolder').load(slides[currentSlide]);
    }
  }

});

You could cache the slides, or just rely on the browser's caching. Button enabling/disabling and such would obviously be nice...