Issues with Batch printing function

Hello.
I am currently trying to write some JS that uses a IFrame that looks into URLs based on the IDs from a table in a knack database. Having issues with 2 parts of it.
The IFrame mostly works but when it prints, it prints the age when it is loading and I cant get it to only print when it has finished loading.

My other issue that I am having is that my button linked to the printButton() function to start the process doesn’t work. I have done all of initial testing when the JS is linked to the page render.:

$(document).on('knack-scene-render.scene_461', function(event, scene) {
  function printButton() {
  var rowCount = $("tr").length;
  var ids = $('tr').map(function(){
      return this.id
  }).get();
  for (let i=1;i<rowCount-1;i++){
    loadOtherPages(ids[i])
  }
  }


  function loadOtherPages(i) {
     $("<iframe>")   
     .attr("id", "frame_"+i)                         
         // .hide()                          
          .attr("src", "https://somecompany#view-and-manage-orders/to-invoice/view-invoice/"+i+"/print-invoice2/"+i) 
          .appendTo("body")
          .on('load', function(){      
    var newDoc = document.getElementById("frame_"+i);
    $(newDoc).load(function(){
      console.log("pass");
      newDoc.contentWindow.print();
    });
    });
  }

  $("<a>")
  .on("click", "printButton()")
  .appendTo("table")
  .text("Print All");


});

Hi Jason,
unable to help with your query (hopefully now sorted) but I am struggling with my own iframe issue which it looks like you have cracked…

I am trying to embed a Gantt chart into a client’s Knack platform using an iFrame code in a paragraph field on a Project record (each Project record will have it’s own chart) but can’t see how to do it. I have the standard stumbling block using Rich Text fields as they can’t accommodate variables / field values.
Any suggestions?
Happy to pay for a bit of time for you to show mw what to do if you know how…
Many Thanks,
Hugo