How do I split html from javascript when rendering new content?

One thing I don't like about writing javascript-bas开发者_开发技巧ed applications is that you have to put a lot of HTML code in Javascript to render new content. Is there a way I can split this up? I find it messy and bloated to combine them in the same javascript code.

You should check out jQuery's Template plugin, it might be helpful depending on what your creating.

May be I cannot understand the question but you can put javascript in the separate file:

<script type="text/javascript" src="some.js"></script>

And you can use jQuery which gives you another abstraction level under HTML:

$('div.button').animate({left: 650, height: 38}, 'slow');

Have you tried a client side template system like EJS ?

I often use a hidden div with prepared HTML which serves like a sample. Then in JS I just take a copy of this HTML-piece and insert the dynamic values. IMHO, it's convenient because all samples are stored together inside HTML file, and JS code doesn't have to know much about it's structure.