Call Javascript function when HTML table finishes loading

Question

I am loading an HTML table through Django:

{% for  m in pays %}
                <tr>
                    <td><center>{{ m.bid }}</center></td>
                    <td><center>{{ m.pDate }}</center></td>
                    <td><center>{{ m.punt }}</center></td>

                </tr>

After this table has the necessary rows filled up. I want to call a function that makes this a datatable.

function inittable(){
         $('#pt').DataTable();
}

Right now, I am initalizing it when the form submits. This causes it to try and load on an empty table. I only want to initalize after table loads

Answer 1

whether put the script after the table

{% for  m in pays %}
                <tr>
                    <td><center>{{ m.bid }}</center></td>
                    <td><center>{{ m.pDate }}</center></td>
                    <td><center>{{ m.punt }}</center></td>

                </tr>
{% endfor %}

<script>
function inittable(){
         $('#pt').DataTable();
}
</script>

or put it anywhere in your page inside $( document ).ready()

$( document ).ready(function() {
        $('#pt').DataTable();
    });