Appending dynamisch generierte HTML mit jQuery spielt nicht gut mit Fancybox

Ich benutze Fancybox http: //fancybox.ne), um einen iFrame zu öffnen. Dazu erstelle ich einen Link mit einer Klasse, die auf "item_pop" gesetzt ist:

<div id="events">
    <a href="http://www.example.com" class="item_pop">My Link</a>
</div>

Ich habe dann etwas JavaScript in der Fußzeile, das dies unterstützt:

jQuery(".item_pop").fancybox({
        'width'             : 900,
        'height'            : 500,
        'autoDimensions'    : true,
        'autoScale'         : true,
        'transitionIn'      : 'elastic',
        'titleShow'         : false,
        'transitionOut'     : 'elastic',
        'centerOnScroll'    : true,
        'type'              : 'iframe'
});

Ok, das funktioniert also alles schwimmend. Das Problem ist, dass ich jQuery verwende, um zusätzliche Links wie diese direkt zu erstellen:

jQuery(document).ready(function(){
        update_seconds = 20;
        update_duration = update_seconds * 1000;

        window.setInterval(reload_events, update_duration);
});

function reload_events()
{       
        jQuery.post("http://www.example.com", {type:'any'}, function(data){
            var events = eval(data);
            var html = '';

            for(var i=0; i<events.length; i++){
                var evt = events[i];

                html += '<a href="http://www.example.com" class="item_pop">My Link</a>';
            }

            jQuery('#events').children().remove();
            jQuery('#events').append(html);
        });
}

Dies zeigt die Links zum Bildschirm an, aber wenn Sie darauf klicken, wird der iFrame nicht geöffnet. Stattdessen öffnen sie die gewünschte Seite als neue Seite und nicht als iFrame auf der vorhandenen Seite.

Irgendwelche Ideen? Pros

Antworten auf die Frage(6)

Ihre Antwort auf die Frage