Appending large block of html with append()

append, html, javascript, jquery

Solution

Remove the line breaks.

http://jsfiddle.net/DmERt/

var large = '<div class="accordian_container"><a href="#" class="accordian_trigger"><h4>Co-Borrower Information</h4></a><hr/><div class="accordian_item" id="accord_item_2"><label> First Name</label><br/><input type="text"/><br/><label>Middle Name</label><br/><input type="text"/><br/><label>Last Name</label><br/><input type="text" /><br/><label>Home Number</label><br/><input type="text"/><br><label>Work Number</label><br/><input type="text"/><br><label>Cell Number</label><br/><input type="text"/><br></div></div>';

$('#accordion_container').append(large);​

Problem

Im trying to append a large block of text using jquery's append(). ``` $('#add_contact_btn').click(function(event) { event.preventDefault(); var large = '<div class="accordian_container"><a href="#" class="accordian_trigger"><h4>Co-Borrower Information</h4></a><hr/><div class="accordian_item" id="accord_item_2"><label> First Name</label><br/><input type="text"/><br/><label>Middle Name</label><br/> <input type="text"/><br/> <label>Last Name</label><br/> <input type="text" /><br/> <label>Home Number</label><br/> <input type="text"/><br> <label>Work Number</label><br/> <input type="text"/><br> <label>Cell Number</label><br/> <input type="text"/><br> </div> </div>'; $('#accordion_container').append(large); }); ``` It doesn't seem to be working and after looking at the documentation for append(), I can't figure out why - any ideas? Is it the large amount of HTML that I am trying to append?

Original source

Related problems