HTML行未在浏览器中显示

Question

I'm populating HTML tbody with rows through jquery,it doesn't show the new rows in the browser but if I try to see tbody content in chrome console it shows me the html but it doesn't displays that in browser.

Code: Javascript

function initTables() {
MergeObjects_ToArry(statsGroup.obamaFollowers.lang, statsGroup.trumpFollowers.lang, 'lang');
addRowToTable(statsGroup.mergedFollowers['lang'], "tblLanguageGroup");

MergeObjects_ToArry(statsGroup.obamaFollowers.timeZone, statsGroup.trumpFollowers.timeZone, 'timeZone');
addRowToTable(statsGroup.mergedFollowers['timeZone'], "tblTimeZone");

MergeObjects_ToArry(statsGroup.obamaFollowers.age, statsGroup.trumpFollowers.age, 'age');
addRowToTable(statsGroup.mergedFollowers['age'], "tblAgeGroups");
}

function addRowToTable(data, tblId) {
var rowHtml = '';

Object.keys(data).forEach(function (key, index) {
    rowHtml += "<tr>";
    rowHtml += '<td>' + key + '</td><td>' + data[key][0] + '</td><td>' + data[key][1] + '</td>';
    rowHtml += "</tr>";
});

$("#" + tblId).find('tbody').append(rowHtml);
}

function MergeObjects_ToArry(obj1, obj2, keyName) {//obama , trump
var obama = jQuery.extend(true, {}, obj1);
var trump = jQuery.extend(true, {}, obj2);

Object.keys(obama).forEach(function (key, index) {
    if (trump[key]) {//if key exists in small
        obama[key] = [obama[key], trump[key]];// Merge values in ARRAY
    }
    else {
        obama[key] = [obama[key], 'N/A']; // key is in only obj1 so add it in mergedObj
    }
});

statsGroup.mergedFollowers[keyName] = obama;
//merge keys in trump not present in obama
}

Code: HTML

<div id="statsCharts" class="chartsSection" style="display:none;">
@*Account Age Comparision Trump vs Obama*@
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4>
                    Account Age Comparision Trump vs Obama
                </h4>
            </div>
            <div id="ageChart" class="dvChart"> </div>
            <div class="dvScrollable" style="display:none;">
                <table id="tblAgeGroups" class="table table-condensed tablesorter">
                    <thead>
                        <tr>
                            <th>Account Age</th>
                            <th>Trump</th>
                            <th>Obama</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>
</div>

@*Time Zone Comparision Trump   vs Obama*@
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4>
                    Time Zone Comparision Trump vs Obama
                </h4>
            </div>
            <div id="timeZoneChart" class="dvChart" style="position: relative; width: 960px; height: 800px;"> </div>
            <div class="dvScrollable" style="display:none;">
                <table id="tblTimeZone" class="table table-condensed tablesorter">
                    <thead>
                        <tr>
                            <th>Time Zone</th>
                            <th>Trump</th>
                            <th>Obama</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>
</div>

@*Language Comparision Trump    vs Obama*@
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4>
                    Language Comparision Trump vs Obama
                </h4>
            </div>
            <!-- Chart -->
            <div id="langGroupChart" class="dvChart"> </div>
        </div>
    </div>
</div>

In the Browser:

TLDR: I have the data from api and I have tried to populate the three html table only one gets displayed with new data ,other two have data when I check in console but they don't get displayed.

Answer 1

Have you tried to comment the line where you add the chart 'timeZoneChart'? Your api is sending data for timeZone?