Question

I have a very simple data that i want to display in table.

DATA

[{“1″:”Red”,”2″:”Orange”,”3″:”Blue”,”4″:”Yellow”}]

CODE:

 var a = [];
                    $.each(data, function (key, val) {
                        a.push('<tr id="tr_' +key+ '">');
                        a.push('<td>' + key+ '</td>');
                        a.push('<td>' + val+ '</td>');
                        a.push('</tr>');
                    });
                    var s = a.join('');
                    $('#color-list').html(s);

The above code resulted in [object Object] instead of the Data.

Below is my expected result

1 Red

2 Orange

3 Blue

4 Yellow

Any suggestion will be greatly appreciated

Answer 1

Your data variable is an array (containing only one element). The object is actually the first element of that array. So use:

$.each(data[0], function (key, val) {
    ...