jQuery: Remove first easySlider instance and re-initiate a new

I’m using easySlider and masonry but I’m having problems in using multiple instances of easySlider. What I’m trying to do is to remove the first instance of easySlider and then create a new instance that has new set of images.

Here’s a demo: http://keanetix.co.cc/folio2010

But it doesn’t seem to work correctly. When you click box#1 (CM Partners) the slider works great. But when you click on box#3 (NBCM), the slider doesn’t work and notice that it adds a ‘Previous’ link even though it’s the first frame/slide. Also, the slider doesn’t work.


	firstClick = true;

    $('div.box a.hideable').click(function(){
			singleMode: false,
			columnWidth: 10,
			resizeable: true,
			itemSelector: '.box',
			animate: false,
			saveOptions: true

		// if there's already a box expanded
		if(firstClick == false)
			//alert("Not first click! prev box slider "+prevsliderid);

            $('div#' + prevboxid)
				// remove previous easySlider instance
                  $('div#'+prevboxid+' div').addClass('expandable');

			// then open new clicked box

			var boxid = $(this).attr("id");
			var sliderid = $('div#'+boxid+' div.slider').attr("id");
            $('div#' + boxid)

                  // show hidden content when box has expanded completely
                  $('div#'+boxid+' div').removeClass('expandable');

			$.scrollTo('div#'+boxid, 400);

			// load easySlider for selected div
			$('#' + sliderid ).easySlider();

		prevboxid = boxid;
		prevsliderid = sliderid;
		return false;



I’m not sure if I’m doing it right. But here’s the part of the code that should remove the first instance:

// remove previous easySlider instance

Can someone help me with this?