The scenario is :
When the user clicks on the Add Button a row should get added to the table dynamically.But i need this table to be created at a specific position in the form (as shown in bold below form structure):

I have two functions out of which, in one i am creating my html elements using javascript and in the other i am handling my button events.
The thing is as shown below:

Code:
function createHtml(){


      1. TextField
      2. Add Button1
     3.Dynamic table to be created on the click of Add Button1
      4.Add button2
      5.Dynamic table to be created on the click of Add Button2

}

function handleEvents(e){

        eventHandling code.
}
Now as shown in the above function when the user clicks on Add Button1 i want a row to be get added at the Postion3.And this is to be done everytime the button is clicked at that specific postion only.

Can anybody please help me in achieving this task.