JavaScript templated questioneer

templated_questions.coffee

renderTemplate = (template, data) ->
  template
    .replace(/{{example_page}}/g, data["example_page"])
    .replace(/{{page_type}}/g, data["page_type"])

mockupHtmlTemplate = '<div>
<label>Example page:<input onchange="textChanged(this)" name="example_page" value="{{example_page}}"></label><br/>
<label>Page type:<input onchange="textChanged(this)" name="page_type" value="{{page_type}}"></label>
</div>'

mockupTextTemplate = '
Example page: {{example_page}}\n
Page type: {{page_type}}'

data = [
  "example_page": "xyz"
  "page_type": "xyz"
  widgets: [
    "placement": "xyz"
    "style": "xyz"
    "layout": "xyz"
    "content_type": "xyz"
    "sc_percentage": "xyz"
    "header_text": "xyz"
    "interaction_examples": "xyz"
    "other_instructions": "xyz"
  ]
]

window.textChanged = (x,y,z) ->
  console.log x.name

($ (renderTemplate mockupHtmlTemplate, data[0])).insertBefore ($ "#description")
($ "#description").text(renderTemplate(mockupTextTemplate, data[0]))

templated_questions.html

<textarea id="description"></textarea>