Loading My Sites within iFrame - Hide SuiteBar div

Question

I am loading MySites in an iFrame within another Site Collection. This works with a PageViewer webpart but I would like to hide the new Suitebar since there is already one on the parent page. Any ideas on how to do this? The following jQuery should work but it can't seem to find the 'suiteBar' child. My guess would be the iFrame isn't loaded when this fires, but I can get that element. It is the child that I'm having shows undefined.

$(document).ready(function() {
 var iframe = document.getElementById("MSOPageViewerWebPart_WebPartWPQ2");
 var sb = $('#MSOPageViewerWebPart_WebPartWPQ2').contents().find('#suiteBar');
});

Answer 1

Since you can view MySite using PageViewer web part, I'm assuming it's within same domain.

<script type="text/javascript">
 $(document).ready(function(){
    var mySiteIframe = $("#MSOPageViewerWebPart_WebPartWPQ2");
       mySiteIframe.load(function(){
       window.console && console.log('Loading Iframe');
       mySiteIframe.contents().find("#suiteBar").css("display", "none");
    });
 });
</script>