Search code examples
javascriptjqueryhtmlinnerhtml

Set document element's innerHTML to a long string

I'm using JQuery to dynamically set a div element. It has multiple lines that have very specific spacing, so this is my code: 

document.getElementById('body').innerHTML = "Developer:  A <br/> &emsp;&emsp; &emsp; &emsp; &nbsp;&nbsp; B <br> &emsp; &emsp; &emsp; &emsp; &nbsp; C <br> &emsp; &emsp; &emsp; &emsp;&nbsp;&nbsp; D";

As you can see this code looks horrible, is there any way to set the innerHTML line by line? For example,

document.getElementById('body').innerHTML = "Developer:  A";     
document.getElementById('body').innerHTML = "Developer:  B";

and have it show up the same way?

Thank you!

Solution

  • You can span multiple lines:

    document.getElementById('body').innerHTML = "Developer:  A <br/>" +
                                            "Developer:  B";

    Or, you can do multiple assignments:

    document.getElementById('body').innerHTML  = "Developer:  A <br/>";
document.getElementById('body').innerHTML += "Developer:  B"; // Note the += instead of just =