Adding items (table rows) jQuery

Question

I'm trying to add more rows into a TD item. So, when i click a link, all TD would get an extra TR.

<td>
    <tr>Test</tr>
    <tr>Test</tr>
    <tr>Test</tr>
</td>

<td>
    <tr>Test</tr>
    <tr>Test</tr>
    <tr>Test</tr>
</td>

<td>
    <tr>Test</tr>
    <tr>Test</tr>
    <tr>Test</tr>
</td>

I've been trying with this,

$('#add_rows').click(function()
{
    $("td").append("<tr>Test</tr>");
});

But it won't work... what am i doing wrong?

Your basic HTML knowledge is wrong. <TD> tags are contained by a <TR> not the other way around. — Samson
– Samson, Commented Sep 9, 2012 at 14:53
link is not added in the sample code, no need as alert etc works. TD or TR one way or another, css takes care of how it should work. — MelusDecus
– MelusDecus, Commented Sep 9, 2012 at 14:54

davidbuzatto · Accepted Answer · 2012-09-09 15:09:54Z

1

Your table structure is incorrect. <tr> are Table Rows, so, they have <td> (Table Data) items. Your selector expression is correct, but as I said, your structure is incorrect, so your code not works. Take a look: http://jsfiddle.net/h6K66/

So, you just need to invert your structure.

edited Sep 9, 2012 at 15:09

answered Sep 9, 2012 at 14:56

davidbuzatto

9,4841 gold badge48 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

MelusDecus Over a year ago

Yes, if i have an alert, it shows. $('#add_rows').click(function() { $("tr").append("<td>Test</td>"); alert('test'); });

davidbuzatto Over a year ago

As I said, your problem is your table structure. Change it to the correct way (<td> inside <tr>) and your code will work.

Collectives™ on Stack Overflow

Adding items (table rows) jQuery

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related