How to change and track changes to a textarea
<p>I found it really hard to come up with a question title for this one so I apologise that it's fairly cryptic but I'll try explain better there.</p>

<p>Basically part of an app I'm developing involves placing 'placeholders' in a textarea and then modifying those placeholders outside of the textarea. </p>

<p>For example:</p>

<pre><code>This is the &lt;first&gt; placeholder. This is the &lt;second&gt; placeholder.
This is the &lt;first&gt; placeholder again.
</code></pre>

<p>Basically i have JS that detects these placeholders and creates input boxes to hold the text. So there would be an input text box for <strong>first</strong> and one for <strong>second</strong>. </p>

<p>What I want to achieve is when I type a value into the textbox it changes the placeholder in the textarea to the content being typed into the textbox. Think sublime text editor's snippets for a textarea.</p>

<p>I'm trying to figure out how I can track the placeholders in the text area. For example if a placeholder was <code>&lt;first_name&gt;</code> and i started typing into the placeholders textbox 'Billy'. I could easily change the placeholder by using a string replace function. However now the placeholder <code>&lt;first_name&gt;</code> doesn't exist in the textarea and so now I can't go back and change it. I need to have a way of tracking these placeholders whilst they are changing.</p>

<p>I hope that makes sense.</p>
