Using Java script :How can I change my content replace function to get my desire result?

When you copy and paste

<tt>1<tt>2<tt>3<tt>

into this function:

function process() {
var content=
document.getElementById('content').value;

content= content. replace(/<tt>)(.*?)(<tt>(.*?)<tt>(.*?)<tt>/g, '<$2><$2><$2>');

document.getElementById('content').value=content;
}

HTML

<textarea id="content" cols="48" rows="8">
</textarea><br/>
<input type="button" value="Process"
onclick="process()"/>

And click process you will yield this result:

<1><1><1>

How can I yield this result instead?

<1><2><1>

I can not simply use this content.replace

content= content. replace(/<tt>)(.*?)(<tt>(.*?)<tt>(.*?)<tt>/g, '<$2><2><$2>');

to yield my desired result since the numbers are subject to change: for instance one day they may be

<tt>2<tt>5648<tt>19897<tt> 

which would currently yield this result:

<2><2><2>

while I would prefer to have it yield this result:

<2><5648><2>

to summarize my question,how can I have the first and third number both change to the 1st number whilst the second number remains constant throughout. I will provide a link to my example currently set up http://jsfiddle.net/WVUYX/35/