Jquery Slide Show: Correct Trigger?

Question

I am having some trouble with an implementation of Soh Tanaka's excellent jQuery slide show technique. I need to nest the trigger anchor tags inside an unordered list, which breaks the script (pulling the anchor tags out of the < ul > list otherwise corrects the problem). I think it comes down to how $selected is defined is this line:

$selected = $('#ix_slideshow_nav li a.selected').next();

HTML

<div id="ix_slideshow_wrap"><div id="ix_slideshow_box">
<div id="ix_slideshow_window">
        <ul id="ix_slideshow_reel">
            <li class="ixss">
                <dl>
                    <dt><a href="#">Sentence 1</a></dt>
                    <dd><a href="#"><img src="ss-focus.jpg" width="860" height="400" alt="" /></a></dd>
                    <dd class="ixss_desc">Here is a one-sentence introduction to the bullet point. <a href="#" title="Learn More">Learn More</a></dd>
                </dl>
            </li>
            <li class="ixss">
                <dl>
                    <dt><a href="#">Sentence 2</a></dt>
                    <dd><a href="#"><img src="ss-improve.jpg" width="860" height="400" alt="" /></a></dd>
                    <dd class="ixss_desc">Here is a one-sentence introduction to the bullet point. <a href="#" title="Learn More">Learn More</a></dd>
                </dl>
            </li>
            <li class="ixss">
                <dl>
                    <dt><a href="#">Sentence 3</a></dt>
                    <dd><a href="#"><img src="ss-save.jpg" width="860" height="400" alt="" /></a></dd>
                    <dd class="ixss_desc">Here is a one-sentence introduction to the bullet point. <a href="#" title="Learn More">Learn More</a></dd>
                </dl>
            </li>
        </ul>
    </div><!-- end ix_slideshow_items --></div><!-- end ix_slideshow_box -->

    <ul id="ix_slideshow_nav">
        <li id="ss1"><a href="#" rel="1" class="">1</a></li>
        <li id="ss2"><a href="#" rel="2" class="">2</a></li>
        <li id="ss3"><a href="#" rel="3" class="">3</a></li>
    </ul>
</div><!-- end ix_slideshow_wrap -->

JQUERY

    $(document).ready(function(){

    //Show the paging and activate its first link
    $("#ix_slideshow_nav a:first").addClass("selected");

    //Get size of the image, how many images there are, then determine the size of the image reel.
    var imageWidth = $("#ix_slideshow_window").width();
    var imageSum = $("#ix_slideshow_reel .ixss dd img").size();
    var imageReelWidth = imageWidth * imageSum;

    //Adjust the image reel to its new size
    $("#ix_slideshow_reel").css({'width' : imageReelWidth});


    //Paging  and Slider Function
    rotate = function(){
        var triggerID = $selected.attr("rel") -1; //Get number of times to slide
        var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide

        $("#ix_slideshow_nav a").removeClass('selected'); //Remove all selected class
        $selected.addClass('selected'); //Add selected class (the $selected is declared in the rotateSwitch function)

        //Slider Animation
        $("#ix_slideshow_reel").animate({
            left: -image_reelPosition
        }, 500 );

    }; 

    //Rotation  and Timing Event
    rotateSwitch = function(){
        play = setInterval(function(){ //Set timer
            $selected = $('#ix_slideshow_nav li a.selected').next(); //Move to the next nav item
            if ( $selected.length === 0) { //If slideshow nav reaches the end...
                $selected = $('#ix_slideshow_nav a:first'); //go back to first
            }
            rotate(); //Trigger the paging and slider function
        }, 2000); //Timer speed in milliseconds 
    };

    rotateSwitch(); //Run function on launch

    //On Hover
    $("#ix_slideshow_nav a").hover(function() {
        clearInterval(play); //Stop the rotation
    }, function() {
        rotateSwitch(); //Resume rotation timer
    }); 

    //On Click
    $("#ix_slideshow_nav a").click(function() {
        $selected = $(this); //Activate the clicked paging
        //Reset Timer
        clearInterval(play); //Stop the rotation
        rotate(); //Trigger rotation immediately
        rotateSwitch(); // Resume rotation timer
        return false; //Prevent browser jump to link anchor
    });


});

Answer 1

Found the answer to get the path right:

$selected = $('#ix_slideshow_nav li a.selected').parent().next().find('a'); //Move to the next nav item

A hat tip to my friends at Bendyworks.com for the answer.