jquery Datatable - Uncaught TypeError: Cannot read properties of undefined (reading 'length')

I am having the following error around undefined (reading 'length') on Jquery Datatable.

I am generating the table dynamically.

table#myTable.table.is-fullwidth
            thead
                tr
                    each column in tableColumns
                        th
                            p #{column}   
            tbody
                each row in tableResults
                    tr
                    each data in row
                        td
                            p #{data}           

and call the javascript as such.

 script.
        $(function() {
            $('#myTable').DataTable();
        });

I am trying to get some pagination and sorting function into the html table.

Can anyone point me in the right direction?

So I found the issue for this. Basically the DOM is not in the right format, for anyone else who is struggling with this error:

• Cannot read property 'length' of undefined (HTML DOM sourced)
• dataTables.min.js:37

Please check your HTML DOM. Hope this helps someone else who come across this.

Below is my update version of the HTML to be render, i had to provide more indent to the following line: This is written in PUG / Jade.

each data in row

table#myTable.table.is-fullwidth
            thead
                each column in tableColumns
                    th #{column}   
            tbody
                each row in tableResults
                    tr
                        each data in row
                            td #{data}