jQuery Cycle in swapped div not working

JavaScript
1

Hi,

I have my navigation loading content from various hidden divs into a main page div.
In one of the swapped divs I have a link to replace the main page div with a Cycle slideshow.
I believe I need to start the .cycle on the images once loaded but having difficulty targeting the loaded div with images.

Here is my navigation link code:


$(document).ready(function(){	
	// replace info div with selected content
	$('a.resSectChoice').live('click', function(e) {
		// determine which content has been selected
		var newDivContent = $(this).attr("name");
		// replace current content with selected and fade in
		$('#mainBodyContent #dhInfo').html($('#' + newDivContent).html()).fadeIn();

		return false;
	});
});

Here is the div’s html I am loading in that contains the slideshow link:


		<!-- Retouching -->
		<div id="retouching" class="infoSection">
            <h1 class="sectionTitle">Retouching</h1>
            <p class="sectionInfo">From white balancing and skin tone adjustments to advanced compositing, I'm able to quickly learn your style and can fine-tune your photos so they look just like you want them to. I've done exacting work for advertising and editorial clients as well as precision color matching from transparency for fine art clients using calibrated monitors with the printer profiles you need.</p>
            <p class="sectionInfo">clients:&nbsp; numerous</p>
            <p class="sectionInfo"><a class="resSectChoice" name="retouchExample" href="">example</a></p>
		</div>

And here is the div containing the images that I would like Cycle to cycle:


        <!-- retouching example -->
        <div id="retouchExample" class="infoSection">
            <!-- slideshow -->
            <div id="slides">
                <img src="images/retouchExamplePics/BB7039_01.jpg" width="500px" height="333px" />
                <img src="images/retouchExamplePics/BB7039_02.jpg" width="500px" height="333px" />
                <img src="images/retouchExamplePics/BB7039_03.jpg" width="500px" height="333px" />
                etc...
            </div>
            <!-- end slideshow -->
        </div>

With just what I’ve listed I get all the images in the main page div.
If I insert this:


		if(newDivContent == "retouchExample") {
			$('#slides').cycle({
				fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
			});
		}

just passed the


$('#mainBodyContent #dhInfo').html($('#' + newDivContent).html()).fadeIn();

of the first code block I get nothing.

thanks for any help in this.