Retrieve dataTable object of element
<p>I am trying to get an object of a jQuery Data Table using JQuery. I am using this thread to accomplish this:</p>

<p><a href="https://datatables.net/forums/discussion/2913/how-to-get-the-otable-datatable-object-from-the-tables-id" rel="nofollow noreferrer">https://datatables.net/forums/discussion/2913/how-to-get-the-otable-datatable-object-from-the-tables-id</a></p>

<p>For some reason this does not work. When I call <code>$('.dynamic-wide-table').dataTable();</code> it causes my table to initialize AGAIN and make the table render twice, like so:</p>

<p><a href="https://i.stack.imgur.com/SgJRj.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SgJRj.png" alt="enter image description here"></a></p>

<p>According to the link posted above it should NOT be doing that, but instead just fetch the object.</p>

<p>Here is my code:
    
    </p>

<p><code>main.js</code> (loaded into HTML head of every page)</p>

<pre><code>$(document).ready(function() {
    $(".dynamic-wide-table").dataTable({
        "aaSorting": [],
        "scrollX": true,
        "scrollY": 530,
        "scrollCollapse": true,
        "lengthMenu": [
            [100, 400, 1000, 5000, -1],
            [100, 400, 1000, 5000, "All"]
        ],
        "retrieve": true
    });
});
</code></pre>

<p>get object:</p>

<pre><code>$(document).ready(function() {
    $('.dynamic-wide-table').dataTable();
});
</code></pre>