jQuery Cycle images in anchors not displaying using slideExpr

jQuery Cycle images in anchors not displaying using slideExpr

Hello - I have tried for hours to find an answer to this. I have a slideshow working perfectly, if I don't wrap my slides (images) in anchor tags. Problem is, I need them in anchor tags. 
I also have some functionality to use my images' alt as the navigation and to put each instance of navigation in it's own div for control over placement (this will be implemented into a CMS at some point) 

Any thoughts on how to get the images WITH anchors to display would be greatly appreciated. 

The HTML - The first two slide instances appear, the last two do not. 
  1. <div class="slides">
  2. <div id="slide-pager"></div>
  3.       <img src="/assets/image1.jpg" alt="Four Words per Slide 1"/>

  4.       <img src="assets/image2.jpg" alt="Four Words per Slide 2" />

  5.       <a href="#">
  6. <img src="/assets/image3.jpg alt="Four Words per Slide 3"></a>
  7.      
  8.        <a href="#">
  9. <img src="src="/assets/image4.jpg" alt="Four Words per Slide 4" /></a>

  10. </div>


Here is my script - 

  1. <script type="text/javascript">

    $(document).ready(function () {
    $('.slides').before('<div id="slide-pager">').cycle({ 
        fx:     'fade', 
        pager:  '#slide-pager', 
        slideExpr: 'img',
        pagerAnchorBuilder: function(idx, slide) { 
    var pagerclass;
    if(idx==0) pagerclass="firstPager";
    else if(idx==1) pagerclass="secondPager";
    else if(idx==2) pagerclass="thirdPager";
    else if(idx==3) pagerclass="fourthPager";
                    return '<div class="'+pagerclass+'">'+slide.alt+'</div>';
        } 
    }); 
    }); 

    </script>