Bind fancy box to elements not yet loaded

I am using datatables (paginator) to display records. I have an option with each record, each of which are to open a fancy box model window. It works fine for the elements loaded on the first page, but for elements that are on subsequent pages (not visible when page is first rendered), fancy box is not binding to them.

Ho can i get this to work? Thanks

See below:

     $(document).ready(function () {
     $("[id$=mdialog]").fancybox({
         'width': '75%',
         'height': '80%',
         'autoScale': false,
         'transitionIn': 'none',
         'transitionOut': 'none',
         'type': 'iframe'
     });


 });




  <td><a id="mdialog" href="details.aspx?scode=<%# Eval("开发者_JAVA百科SCode")%>">[..]</a></td>

You'll need to use jQuery's .live() function to bind the listener to an element that doesn't exist yet.

Then attach it to the object's onload event, and apply your current transformations to it.