jQuery submit delegation

by Julian

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>


<div class="container">
<div class="row">
<div class="col-xs-12 col-md-6 col-sm-8 col-lg-6 center-block animated fadeInUp">

<div class="results">
<ul id="results">
<h3>Cold Feet</h3>
<div class="dark">
<a class="fancybox" id="single_image" data-target="page.php?page_id=237" href="uploads/580693ab89ab0.jpg" title="Cold Feet" width="800">
<img src="uploads/580693ab89ab0.jpg" width="600" class="img-responsive" alt=""/>
</a>
</div>
<small>
posted by:
<a href="profile.php?user_id=user_id" span="" class="">Anderson</a>
</small>
<div class="collab1">
<form id="myForm1" class="myForm" action="" method="post" style="">
<input type="hidden" name="file" value="580693ab89ab0.jpg"/>
<input type="hidden" name="user_name" value="Anderson"/>
<input type="hidden" name="user_id" value="6"/>
<input type="hidden" name="page_id" value="237"/>
<span class="pull-right">
<button class="fabutton" id="Button1">
SUBMIT
</button>
</span>
</form>
<small>
<span class="label label-default">Collaborators</span>
</small>
<table id="myTable1" class="table1">
<tbody>
<tr>
<td>
<small>
<a href="profile.php?user_id=6" class="tags" style="text-decoration: none;">Anderson</a>
,
</small>
</td>
<td>
<small>
<a href="profile.php?user_id=2" class="tags" style="text-decoration: none;">Julian Sykes</a>
,
</small>
</td>
</tr>
</tbody>
</table>
</div>
<hr/>
<h3>The Jungle Book</h3>
<div class="dark">
<a class="fancybox" id="single_image" data-target="page.php?page_id=236" href="uploads/57fbf8d9087d6.jpg" title="The Jungle Book" width="800">
<img src="uploads/57fbf8d9087d6.jpg" width="600" class="img-responsive" alt=""/>
</a>
</div>
<small>
posted by:
<a href="profile.php?user_id=user_id" span="" class="">Julian Sykes</a>
</small>
<div class="collab2">
<form id="myForm2" class="myForm" action="" method="post" style="">
<input type="hidden" name="file" value="57fbf8d9087d6.jpg"/>
<input type="hidden" name="user_name"...

JavaScript

$(document).on('submit', '.myForm', function(e) {

var tableid=$(this).closest("div").find("table").attr("id");//find table id
var this_table='#'+ tableid;//Add ID selector
  $( this_table + '> tbody > tr').append('<td>info,</td>');//Append to table
   
    e.preventDefault();
});