Div not being created

Question

I am converting existing code into template code since it is much cleaner, I am using Mustache as my choice of template engine. I am having trouble getting the below code to work I have included both the old working code and the new Mustache code. The problem is that the div is not being created at all and it just places a < inside of the DealerInfo div.

This is the converted code:

for(i=0; i< markers.length; i++) {
    var testContent = Mustache.render("<div class='{{info_content}}'><h3>{{dealerName}}</h3>" +
                                      "<p>{{address}}<br/>{{city}}, {{state}} {{zip}}<br/>" +
                                      "<a href='{{href}}'>{{hrefTitle}}</a></p></div>", {
        info_content: "info_content",
        dealerName: markers[i][3],
        address: markers[i][2],
        city: markers[i][4],
        state: markers[i][5],
        zip: markers[i][8],
        href: markers[i][6]
    });

    infoWindowContent.push(testContent);
}

This is the old code:

for(i=0; i< markers.length; i++) {
    var testContent = ['<div class="info_content">' + '<h3>' + markers[i][3] + '</h3>' + '<p>' + markers[i][2] + '<BR />' + markers[i][4] + ', ' + markers[i][5] + ' ' + markers[i][8] + '</p>' + '<BR /> <a href="' + markers[i][6] +'">' + markers[i][6] +'</a>' +'</div>'];
    infoWindowContent.push(testContent);
}

This is how I am getting the info to output into the div:

document.getElementById("DealerInfo").innerHTML=infoWindowContent[i][0];

Answer 1

Your problem is:

   document.getElementById("DealerInfo").innerHTML=infoWindowContent[i][0];

In your new code, you are making an array of strings, so infoWindowContent[i][0] gives you the 1st character in the string created via Mustache.render

  document.getElementById("DealerInfo").innerHTML=infoWindowContent[i];

should do the trick. By the way, you can pass an array to Mustache and have it iterate over the items.