*_Expected behavior_*The aim is to create a datatable (since I want the searching and filtering etc.). This datatable should have a listing of accordion items. Each accordion item should have a simple table as its body.

*_Actual behavior_*The rows of the table within the accordion's body are being added to the rows of datatable. In other words, the inner table's rows are being added to the outer table's rows. This behaviour is directly attributed to the datatable as it does not do this with a regular table. If I remove the "datatable" class from the div the problem is gone, but then I will lose all the functionalities of the datatable.

*_Resources (screenshots, code snippets etc.)_*I have also used the examples on your site and regenerated the error in your coding playground:

Here is the link to the snippet:

https://mdbootstrap.com/snippets/standard/caymanlandinfo/5434973

Notice that Mark, Jacob, and Larry are all rows from the table inside the accordion; however, they are all listed in the datatable as well.