after() function not working perfectly with table tag.

after() function not working perfectly with table tag.

WHAT I WANT TO DO:
I am adding rows dynamically to a datalist using add button which is present in each dynamically generated row. Now, when I click on add button a new row adds next to the row in which the clicked add button is present.

HOW I AM DOING:
I am using after() function to perform this task.

THE PROBLEM
While using divs in HTML, this function is working perfectly. But unfortunately when I use table in HTML, it is adding the rows but always at the end. Can anybody give me the solution to this problem??

A BRIEF
Add row dynamically to a datalist which HTML structure is forming in a table tag. New row created must add next to the row whose add button is clicked.