jQuery Cycle Plugin (zero element?)

Question

I used AJAX to populate a div and then, cycle plugin it !

here is the page, and here is the code calling cycle:

<script type="text/javascript">
    $(function() {
        $("#photoviewer").load("photo-list.shtml #ani");
        alert ('photo loaded!');
        $(document).ready(function() {
            $('#ani').cycle({ fx:      'turnDown',
                              speed:   'fast',
                              timeout: 0,
                              pager:   '#nav' });
            alert('done!');     
        });
    });
</script> 

I get this error : [cycle] terminating; zero elements found by selector, but with firebug i SEE the image list as where it should be...

so i am clueless, any help welcome !

*** take note, the error console (warning section) is going crazy !

Answer 1

Instead of initializing cycle in $(document).ready(), do it in a load callback so that it doesn't execute until your ajax call has completed and built the #ani div:

    $(function() {
        $("#photoviewer").load("photo-list.shtml #ani", function() {
            $('#ani').cycle({ fx:      'turnDown',
                              speed:   'fast',
                              timeout: 0,
                              pager:   '#nav' });
        });
    });

As it stands, the cycle plugin initialization is executing before the images have loaded (before the load function has finished).