Question

My application creates an accordion (within another) programatically from data drawn from a database. My question is how can I format said data, adding paragraphs etc. HTML within the text: field is printed literally even when added as a variable.

$('#accordion2').append($('<h3>', {
    id: name,
    text: clientAddress,
    activate: function () {
        gev.trigger(marker, 'click');
    },
    mouseover: function () {
        gev.trigger(marker, 'click');
    },
    mouseout: function () {
        gev.trigger(marker, 'mouseout');
    },
}));

$('#accordion2').append($('<div>', {
    text: "Client Name: " + clientName + " Job Number: " + jobNo + " Property Type: " + propType
})).accordion('destroy').accordion({
    collapsible: true,
    heightStyle: "content"
});

Thanks in advance for any help and if you have any questions on the code just ask.

Swires.

Answer 1

You’re using append incorrectly. Try this.

$('#accordion2').append("<div> Client Name: " + clientName + "<br/> Job Number: " + jobNo + " <br/>Property Type: " + propType + " </div>"}))

Code is adding br tags between each item in your list but obviously you could add any markup.