My problem is that the html variable returns something like this: [object Object][object Object][object Object][object Object][object Object], instead of the elements.

What should i do different?

var html = '';
$.each(data.response, function(index, value) { 
    var tr = $('<tr>');
    var tr_data = '<td>asd</td>';
    html += tr.data('trackinfo',value).html(tr_data);   
});

$(target).html(html);

My problem is that the html variable returns something like this: [object Object][object Object][object Object][object Object][object Object], instead of the elements.

What should i do different?

var html = '';
$.each(data.response, function(index, value) { 
    var tr = $('<tr>');
    var tr_data = '<td>asd</td>';
    html += tr.data('trackinfo',value).html(tr_data);   
});

$(target).html(html);

• javascript
• jquery
• dom
• append
• each

• Can you please post what the data variable contains. I'm guessing JSON? – Rory McCrossan Commented Feb 13, 2012 at 16:13

2 Answers 2

That's because you're setting the data on the tr and then filling it with your html, but still concatinating an object, which converts it to a string... aka

"[object Object]"

Not exactly sure what you're after but you might try changing this...

html += tr.data('trackinfo',value).html(tr_data);   

To this...

html += tr.data('trackinfo',value).html(tr_data).html();   

By default, Jquery creates objects not html mark-up. To get html you should to call html() method.

Here is working code:

var html = '';
$.each(data.response, function(index, value) { 
    var tr = $('<tr>');
    var tr_data = '<td>asd</td>';
    html += tr.data('trackinfo',value).html(tr_data);   
});

$(target).html(html);