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:

Answer 1

The error just means there is no selector named "#ani" available it seems like the "#ani" is a child node of "#photoviewer" and when the ajax request is complete it then adds "#ani".

After you call:

 $("#photoviewer").load("photo-list.shtml #ani"); 

Try this:

var interval = setInterval(function(){ 
  if(jQuery("#ani").length > 0) {
    clearInterval(interval); 
    jQuery('#ani').cycle({fx:'turnDown', speed:  'fast', timeout: 0, pager:  '#nav'}); 
  }
}, 1);                          

Answer 2

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).