The HTML that is generated by fancyTitle does not seem to get the behaviour for #fancyplay

gistfile1.txt

    function fancyTitle(title, currentArray, currentIndex, currentOpts) {
        return '<div id="fancydescription">' + (title && title.length ? '<span>' + title + '&nbsp;</span>' : '' ) +  '</div><div id="fancycount">Image ' + (currentIndex + 1) + ' of ' + currentArray.length + '</div><div id="fancycontrols"><a href="#" id="fancyplay">Play</a> <a href="#" id="fancypause"> Pause</a></div><div style="clear:both;"></div>';
    }

    $('.fancybox').fancybox({
        'titleFormat' : fancyTitle,
        'cyclic' : true,
        'overlayColor' : '#000',
        'overlayOpacity' : 0.5
    });

    $('#fancyplay').live('click',function(event) {
        //Do something
        alert('Vas is los?')
        event.preventDefault();
    });