JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<table id='test'>
    <tr id="tbl_list"></tr>
</table>
<input type="button" id="btn_addrow" value="OK">

JavaScript

$(document).ready(function(){
	$("#btn_addrow").on("click", function () {
		var text = "<tr>";
			text += "<form class='frm_add' id='testcontainer'>";
			text += "<td><input type='text' name='date'> </td>";
			text += "<td><input type='text' name='note'></td>";
			text += "<td><input type='submit' value='add row' id='submit'></td>";
			text += "</form></tr>";
	    $("#tbl_list").prepend(text);

	});

    
	// 1: id="submit" is added to the form submit button

	// 2: fire the form submit event within the click event of the form submit button

	$('body').delegate('#submit','click',function(event){	
		console.log('submit button is clicked');

		// 3: define the actions to do when the form submit event is fired  
		$('#testcontainer').submit(function(){
			console.log('form submitted');
			//return false;
		});

		// below the form submit event is fired 
		$('#testcontainer').submit();
		console.log('form submit event is fired ');
	    	
		//return false;
	   /* $.ajax function will go here to save row */	
	});
});