Add or remove individual column in table

Question

I am currently writing a script where the user needs to add data to a table, but he can use an add button to add another column and this needs to be done on each individual row. Also, I would need a remove button which comes up next to each information as you mouse over each bit of information.

At the minute I have a static table where it has two columns on each row like this...

<table>
    <tr>
        <td>Row1 Column1</td>
        <td><input type="text" name="val2">Row2 Column1</input>//Remove btn on mouseover</td>
    </tr>//Add btn
    <tr>
        <td>Row1 Column2</td>
        <td><input type="text" name="val2">Row2 Column2</input>//Remove btn on mouseover</td>//Add btn
    </tr>
</table>

What would I need to dynamically add and/or remove each item, Javascript or jQuery?

Do you know any tutorials which could help with this?

My Javascript and jQuery knowledge is pretty much void since I haven't looked at it in over a year.

Answer 1

http://www.mredkj.com/tutorials/tableaddcolumn.html

Then use jquery to post the info to your server and a php handler to handle the info and save it.