I have the following things available with me:

1) A set of open source email blueprints

2) An HTML/JQuery based text editor.

Please find the image link below:


What I want is, the HTML page in the image should appear first
and when a user clicks on "use template" option, the template should be inserted into the
text editor area. This text editor is located on a separate HTML page as I mentioned in point #2

Considering the first red encircled template, I have inspected the code in dreamweaver and found the

<div style="display: none;" id="filterDescription" class="error"></div>
	<div id="templatesWrap">
		<div class="template" data-templatelocation="AboveBoard" data-templatename="Above Board" data-templateid="" data-templatetype="" data-templatecategory="General">
		<div class="templateContainer">
			<a href="https://app.xyz.com/icp/core/compose/message/create?token=dc794ce9dfb14efa377199cf990ca360&amp;sMessageTemplateId=AboveBoard&amp;sHubId=&amp;goalComplete=200" title="Use Template">
									<img class="thumbnail" src="iContact%20%20%20Select%20a%20Template_files/thumbnail_032.jpg" alt="AboveBoard">
			<div class="templateName">Above Board</div>
			<a href="https://app.xyz.com/icp/core/compose/message/create?token=dc794ce9dfb14efa377199cf990ca360&amp;sMessageTemplateId=AboveBoard&amp;sHubId=&amp;goalComplete=200" title="Use Template" class="button secondary">Use Template</a>
			// CODE for next template starts after this which  is AboveBoardRight
			<div class="template" data-templatelocation="AboveBoardRight" data-templatename="Above Board Right" data-templateid="" data-templatetype="" data-templatecategory="General">
				<div class="templateContainer">
					and so on.....


1) How can I make sure on the client side that , when a user clicks on "Use Template" option it gets inserted into the text editor?

2) Can I do it on the client side?

3) It's difficult to figure out from the above code since the content of <a href tag is kind of messed up.

Please clarify.