Dynamic number of charts through jquery

[alesssz]

Hello everyone,
I'm using JSreport 3.4.1. and Chart.js 3.8.0.
From a server API I'm getting a series of data to create n. charts. The problem is that the number of charts are never the same (they depend on various parameters in a database).
I cannot create n. static charts for the reason above, so I was trying to dynamically create and inject them in the DOM through JQuery, but I'm having some difficulties:
It succesfully create the first chart, but with wrong data (like it isn't waiting for the trigger input), and the second chart isn't shown at all.

Any idea on how to create a dynamic number of charts based on the number of objects (inside an array) that arrives through API?

I've set a playground with mock data (not really needed cause I've put static data inside the charts) so you can see what I mean:
playground test

Thank you

[jan_blaha]

You just trigger the print when the last chart is rendered
https://playground.jsreport.net/w/anon/6Fbv~~ld

[alesssz]

@jan_blaha thank you for your answer but it still renders only one chart.
Based on your answer, I figured it out though:
If you separate the "creation" of the html element and the "creation" of the charts, it works as intended.
Here's the playground, if someone had my same problem

Playground test