You can not directly add value to TR tag,
you should add tr and then append the column value inside the TR,
Try something like below.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
$(function() {
var json = {
"Number": "10031",
"Description": "Solid Parts",
"Factory": "Factory1",
"LocationIn": "OutRack",
"Quantity": 18
}
var parsed = $.parseJSON(JSON.stringify(json));
console.log(parsed);
var $thead = $('#tableId').find('thead');
var tr = $("<tr>");
$thead.append(tr);
$.each(parsed, function(name, value) {
$(tr).append('<th>' + name + '</th>');
});
});
<!-- language: lang-html -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tableId" class="table table-condensed responsive" border="1">
<thead>
</thead>
<tbody>
</tbody>
</table>
<!-- end snippet -->
Within a `tr` in `thead`... Ususally *(that is sarcastic a bit)*, you need some `th` to display text.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
$(function() {
var json = {
"Number": "10031",
"Description": "Solid Parts",
"Factory": "Factory1",
"LocationIn": "OutRack",
"Quantity": 18
}
var parsed = $.parseJSON(JSON.stringify(json));
console.log(parsed);
var $thead = $('#tableId').find('thead');
var $tr = $("<tr>");
$.each(parsed, function(name, value) {
$tr.append('<th>' + name + '</th>');
});
$thead.append($tr);
});
<!-- language: lang-html -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tableId" class="table table-condensed responsive">
<thead>
</thead>
<tbody>
</tbody>
</table>
<!-- end snippet -->