Why is Jquery not seeing the unique id?
<p>I have a page that contains dynamic forms and tables that are fetched with ajax. I am trying to target each table depending on which form submit button was pressed but for some reason jquery does not seem to see the unique id of the tables. I suspect that jquery is only fetching the id of  the first table but I can't understand why?</p>

<p><code>console.log(tableid)</code> prints <code>myTable1</code> on all the submit buttons I press however inspecting the html on the page shows me that all the id's of <code>myTable</code> are unique eg <code>myTable1,myTable2,myTable3</code>.....and so on.</p>

<p>The dynamic form and table</p>

<pre><code>&lt;form id="myForm" class="myForm" action="" method="post" style=""&gt;

    &lt;input type="hidden" name="page_id" value="'.$id.'"&gt;


   &lt;button type="submit" class="fabutton"&gt;&lt;/i&gt;&lt;/button&gt;
&lt;/form&gt; &lt;!--END OF FORM----&gt;



&lt;table id="myTable'.$i.'" class="table"&gt;&lt;!--$i increments by 1 with each form----&gt;
    &lt;tbody&gt;
        &lt;tr&gt;
  &lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p>The jquery (on another page where the form and table are rendered)</p>

<pre><code>$(document).on('submit', '.myForm', '.results', function(e) {

             var tableid = $('.table').attr('id'); //Get table id

             console.log(tableid)
</code></pre>