title: jquery incorrect first text field value
body: <p>I have a popup. It has three text input fields. All of them have some values that have been set up via another form. The second and third fields have the correct value when I focus on them. </p>
  
  <p>On focusing on the first field, I don't get the content as expected. I have used html() function of jquery to display the content in these text input fields.   </p>
  
  <p>A screenshot is here: <img src="https://i.stack.imgur.com/c5AOD.png" alt="enter image description here"></p>
  
  <p>A snippet of my ready function is here: </p>
  
  <pre><code>$(document).ready(function(){ 
    $( "body" ).delegate( ".editDiv", "click", function() {
       changed_id = this.id
       var copyData = $("#" + changed_id).html();
       var changed_class = "edit";
       var new_input = "&lt;input id=" + changed_id + " " + "class=" + changed_class + "&gt;";
       var editableText = $(new_input);
       editableText.val(copyData);
       $(this).replaceWith(editableText);
       editableText.focus(function() { $(this).select(); });
   });
  </code></pre>
  
  <p>The same code returns correct values for 2nd and 3rd fields. But it is not so for the first field. What could be the possible reason?</p>
  
  <p><strong>Edit</strong>
  The HTML code for the popup is:</p>
  
  <pre><code>&lt;div id="dialog-form" title="Add advance"&gt;
  &lt;h4&gt; 
    &lt;b&gt;
      {{ full_name }}
    &lt;/b&gt; 
    &lt;span&gt; 
      &lt;small&gt;
        {{ month_name }} {{ year }}
      &lt;/small&gt; 
    &lt;/span&gt; 
  &lt;/h4&gt;
  
  &lt;table id="special" class="table" style="width: 70%; margin: auto;"&gt; 
    &lt;tbody&gt; 
      {% for a in old_advances %}
        &lt;tr&gt; 
          &lt;td class="text-right popup"&gt;
            &lt;span style="float:left;"&gt; {{ a.advance_date }} &lt;/span&gt;
            &lt;div class="editDiv" id="{{a.id}}"&gt;{{ a.advance_amount|floatformat:2 }} 
          &lt;/td&gt; 
        &lt;/tr&gt;
      {% empty %}
        &lt;p&gt; No advance given this month.&lt;/p&gt;
      {% endfor %}
    &lt;/tbody&gt;
  &lt;/table&gt;
  &lt;/div&gt;    
  &lt;/div&gt;
  </code></pre>