title: jquery template - output to textarea (or: converting jquery object to string)
body: <p>I'm writing a tool that will generate HTML based on JSON data, and puts the output in a textarea for easy copy/paste. I am using jquery templates for generating the HTML but I'm having trouble putting the result in the textarea, because .tmpl() returns a jQuery object (collection of DOM elements).</p>
  
  <p>EDIT:</p>
  
  <p>After testing with a simpler version, I found that $("#HtmlPageTemplate").tmpl().html(); does work. So the problem lies with the actual template. Any suggestions on making the following template work?</p>
  
  <pre><code>&lt;script id="HtmlPageTemplate" type="text/x-jquery-tmpl"&gt;
          &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
          &lt;html xmlns="http://www.w3.org/1999/xhtml" &gt;
          &lt;head&gt;
             &lt;title&gt;API - ${ObjectName}&lt;/title&gt;
             &lt;link rel="stylesheet" href="styles/meyer-reset.css" type="text/css" media="all" /&gt;
             &lt;link rel="stylesheet" href="scripts/google-code-prettify/src/prettify.css" type="text/css" media="all" /&gt;
             &lt;link rel="stylesheet" href="jquery-ui-1.8.13.custom/css/smoothness/jquery-ui-1.8.13.custom.css" type="text/css" media="all" /&gt;
             &lt;link rel="stylesheet" href="styles/api-documentation.css" type="text/css" media="all" /&gt;
             &lt;script src="jquery-ui-1.8.13.custom/js/jquery-1.5.1.min.js"&gt;{{html "&lt;/sc"+"ript&gt;"}}
             &lt;script src="jquery-ui-1.8.13.custom/js/jquery-ui-1.8.13.custom.min.js"&gt;{{html "&lt;/sc"+"ript&gt;"}}
             &lt;script src="scripts/google-code-prettify/src/prettify.js"&gt;{{html "&lt;/sc"+"ript&gt;"}}
             &lt;script&gt;
                 $(function(){
                     if ("onhashchange" in window) { // event supported?
                         window.onhashchange = function () {
                             SelectTabByAnchor(window.location.hash);
                         }
                     }
                     else { // event not supported:
                         var storedHash = window.location.hash;
                         window.setInterval(function () {
                             if (window.location.hash != storedHash) {
                                 storedHash = window.location.hash;
                                 SelectTabByAnchor(storedHash);
                             }
                         }, 100);
                     }
  
                     function SelectTabByAnchor(anchor){
                         var tab = -1;
  
                         if(anchor.substr(0, 10) == "#Property-"){
                             tab = 0;
                         }
                         else if(anchor.substr(0, 8) == "#Method-"){
                             tab = 1; 
                         }
                         else if(anchor.substr(0, 7) == "#Event-"){
                             tab = 2;
                         }
  
                         if(tab &gt; -1){
                             $("#PropertiesMethodsEventsContainer").tabs("select", tab);
                             //window.location.href = window.location.hash;
                             window.location.hash = window.location.hash;
                         }
                     }
  
                     $("a").click(function(event){
                         var anchor = $(this).attr("href");
                         SelectTabByAnchor(anchor);
                         // Stop the .Item event from showing/hiding the details
                         event.stopPropagation();
                     });
  
                     $(".Item").click(function(){
                         $(this).next().toggle();
                     }).hover(function(){
                         $(this).addClass("ui-state-hover");
                     },
                     function(){
                         $(this).removeClass("ui-state-hover");
                     });
  
                     prettyPrint();
                     $("#PropertiesMethodsEventsContainer").tabs();
  
                     if(window.location.hash){
                         //SelectTabByAnchor(window.location.hash);
                         $("a[href=\"" + window.location.hash + "\"]:first").trigger("click");
                     }
  
                 });
                 {{html "&lt;/sc"+"ript&gt;"}}
          &lt;/head&gt;
          &lt;body&gt;
              {{tmpl "#ClassTemplate"}}
          &lt;/body&gt;
          &lt;/html&gt;
      &lt;/script&gt;
  </code></pre>