Replacing text input on focus making non ending iterations
<p>I am using the below code to replace text box on focus.. But the thing is it is making non ending repetitions and making textbox unusable.  </p>

<pre><code>  window.changeInputType = function(oldObject, oType) {
    var newObject = document.createElement('input');
    var wrapper= document.createElement('div');
    wrapper.innerHTML= oldObject.outerHTML.replace('type=password','type=text');
    var newObject = wrapper.firstChild;
    var focus = newObject.focus;
    newObject.focus = "xxx";
    oldObject.parentNode.replaceChild(newObject,oldObject);
    newObject.select();
    return newObject;
  }
</code></pre>

<p>And the HTML is </p>

<pre><code>  &lt;input type="password" onfocus="changeInputType(this,'text')"
                         onblur="changeInputType(this,'password')"&gt;​​   
</code></pre>

<p>But this will make non ending repetitions cause every time when I focus it will add the element again and again. Can I replace onfocus and onblur events and assign later with setTimeout function? How can I achieve that</p>
