Load templates (mustache, jQuery, etc.) that are inlined in HTML to object

loadInlineTemplates.js

function loadInlineTemplates(templateSelector) {

	var templatesString = $.trim($(templateSelector).html());

	var templateName = null;
	var templates = {};
	$.each(templatesString.split("\n"), function(i, line) {
		var matches = line.match(/(.*)\.mustache\:/i);
		console.log(matches);
		if (matches !== null) {
			templateName = $.trim(matches[1]);
		} else {
			templates[templateName] = templates[templateName] || [];
			templates[templateName].push(line);
		}
	});

	$.each(templates, function(k,v) {
		templates[k] = v.join("\n");
	});
	return templates;
}

var tmpls = loadInlineTemplates('#templates');
console.log(tmpls);

templates.html

<script id="templates" type="text/x-mustache-tmpl">
base.mustache:
<h2>{{name}}</h2>
<form>
{{#questions}}
  {{&render}}
{{/questions}}
</form>

question.text.mustache:
<fieldset data-role="fieldcontain">
	<label for="question-{{id}}">{{text}}</label>
	<input type="text" name="question-{{id}}" id="question-{{id}}" value="" />
</fieldset>	

question.number.mustache:
<fieldset data-role="fieldcontain">
	<label for="question-{{id}}">{{text}}</label>
	<input type="number" name="question-{{id}}" id="question-{{id}}" value="" />
</fieldset>	

question.picklist.mustache:
<div data-role="fieldcontain">
	<label for="question-{{id}}" class="select">{{text}}</label>
	<select name="question-{{id}}" id="question-{{id}}">
	{{#items}}
	<option value="{{value}}">{{text}}</option>
	{{/items}}
	</select>
</div>														
	
</script>