E. Hoxha E. Hoxha - 2 months ago 12
Javascript Question

Why is jQuery append function not appending the table?

I've been looking around here on stackoverflow, found lots of approved answers but none could help me.

So what I can basically come up with is this table code

<table id="tableid" class="table table-responsive">
<thead>
<tr>
<th>header1</th>
<th>header2</th>
</tr>
</thead>
<tbody id="tbItems">
<tr>
<td>item1</td>
<td>item2</td>
</tr>
</tbody>
</table>
<button type="button" id="btnAddItem" onclick="addProduct">Add</button>


and this js code

var $tableS = $('#tableid');

function addProduct() {
$tableS.append("<tr><td>item2</td><td>item2</td></tr>");
}


but I have 0 ideas as to why it's not working.
Thanks!

Link to jsfiddle: https://jsfiddle.net/LvvbLcn2/1/

Answer

You missed brackets in the onclick attribute:

<button type="button" id="btnAddItem" onclick="addProduct">Add</button>

Here the working example on jsfiddle:

https://jsfiddle.net/LvvbLcn2/6/