how to create html structure dynamically inside the colorbox modal?

Hi I am trying to create a html structure dynamically inside a colorbox iframe but I could not able to target the colorbox iframe and insert the html structure. Any idea what I am doing wrong.

Thanks for any suggestions or advice

Edit1: code version

MY.util.printPreview = function(previewOptions){
       var header, subHeader;
               previewOptions = jQuery.extend({},{
                       title:"Print Page",
                       selector:".print",
                       width:"60%",
                       height:"80%"
               }, previewOptions);

               header = ['<div class="Header"><h1>', previewOptions.title, '</h1>',
                         '<a class="closeModal" href="#close">Close','</a>','</div>'].join("");

               subHeader= ['<div class="modalSubHeader">','<ul><li class="imglogo"></li>','<li class="actualprint print">Print Page</li></ul>','</div>'].join("");



                               jQuery(previewOptions.selector).colorbox({
                                       iframe:true,
                                       width: previewOptions.width,
                                       height: previewoptions.height,
          开发者_如何学Python                             html:jQuery(document).html(),
                                       onComplete:function(){
                                               jQuery("#nav, .media").remove();
                                               jQuery("#wrapper").wrap('<div class="content"/>');
                                               jQuery(".content").prepend(header);
                                               jQuery(".Header").append(subHeader);
                                       }
                                   });
}