Display formatted raw html with jquery

Question

I have a place where I am trying to show code in a text area. I have dumbed down the example but basically user can input some fields, click a button, and the code snippet

Answer 1

Add a \n if you want a new line like

var mySnippet = "<div id=\"myOuterDiv\">\n"
    + "<div id=\"myInnerDiv\">\n"
    + "</div>\n"
    + "</div>\n";
$('#mySnippetArea').text(eventSnippet);

Single character escape sequences:

\b: backspace (U+0008 BACKSPACE)
\f: form feed (U+000C FORM FEED)
\n: line feed (U+000A LINE FEED)
\r: carriage return (U+000D CARRIAGE RETURN)
\t: horizontal tab (U+0009 CHARACTER TABULATION)
\v: vertical tab (U+000B LINE TABULATION)
\0: null character (U+0000 NULL)

Example: http://jsfiddle.net/jtx7e/

Answer 2

just use <pre id="mySnippetArea"></pre> and add \n and space according to the needed layout

edit:

you can also write

var mySnippet =
"<div id=\"myOuterDiv\">\n\
   <div id=\"myInnerDiv\">\n\
   </div>\n\
</div>";