James James - 4 months ago 5
jQuery Question

jQuery adding a div after a generated table

I am sure i have the right logic here and tried after and insertafter but does not seem to work... any ideas?


if(content) {
var $table = $('<table/>');
'<tr><td><img src="' + content[0].image + '" class="thumbnail"/></td>' +
'<td><strong>' + content[0].title + '</strong></td>' +
'<td>SKU: ' + content[0].sku + '</td>' +
'<td>&pound;' + content[0].price + '</td></tr>'
$table.after('<div class="button-container">' +
'<a href="#">view cart</a>' +
'<a href="#">checkout</a>' +


after method requires that the target element ($table) be in DOM - which it isn't until next statement with .html method.

Just move line with after call after the line with html call:

$table.after('<div class="button-container"><a href="#">view cart</a><a href="#">checkout</a></div>');

Useful references: