jQuery-jquery .append（）产生“无法读取null的属性'nodeName'”

Question

I am trying to make a table of listings. I have a variable that contains all the listings necessary called myListingsArray. I want to loop through the array, outputting 5 or less listings at a time. Each listing needs to have it's own properties. Here's what I have so far:

HTML:

<script type="text/template" id="listingsTemplate">
<div class-"listingsDiv">
    <h1 class="listingsTitle">My listings</h1>
    <table id="listingsTable">
        <tr>
            <th>Address</th>
            <th>MLS</th>
            <th>Broker</th>
            <th>Price</th>
        </tr>
    </table>
</div>
</script>

JS:

$(document).ready(function(){
$("#listingsLink").click(function(){
    var personalTotal = myListingsArray.length;
    $(".content").html("");
    var template = $("#listingsTemplate").html();
    $(".content").html(template);
    for(var i = 0; i < personalTotal; i++){
        appendListing(i, "#listingsTable");
    }
});
});

function appendListing(i, location){
/*$(location).append( "
    <tr>
        <td id=\"address\">" + myListingsArray[i].address + "</td>
        <td id=\"mls\">" + myListingsArray[i].mls + "</td>
        <td id=\"broker\">" + myListingsArray[i].broker + "</td>
        <td id=\"price\">" + myListingsArray[i].price + "</td>
    </tr>
");*/ //EDIT: EASIER EXAMPLE
  $(location).append(i);
}

When I run the code above, it returns an error saying 'Cannot read property "nodeName" of null'. "#listingsTable" clearly exists before the function is called so I don't understand why it throws an error.

Please help Thank you

Answer 1

Well, I took a little break, came back, ran my code again and it suddenly worked. I refreshed it a thousand times before and it didn't but for some reason now it does. Sorry to bother, have a good day everyone!