title: How to update the textbox value based on other textbox using JavaScript?
body: <p>I have three input text boxes in my form. </p>
  
  <p>First one is teacher, second one is grade. Now I've the third input text box, where i need to update the value dynamically from these two values as "(teacher)'s (X) class" using JavaScript.</p>
  
  <p>Can anyone help me in writing the code?
  Thanks in advance.</p>
  
  <p>here is the jquery code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function(){
      $('#both').value($('#teacher').val() + "'s " + $('#grade').val());
  });
  
    &lt;/script&gt;
  </code></pre>
  
  <p>and my input tags are:</p>
  
  <pre><code>&lt;input type="text" name="teacher_name" id="teacher" value="" style="background:#f7f6f2 url(../images/input_02.png) repeat left top;border: 0px;width: 250px;height: 10px;padding: 10px;display: block;"&gt;
  &lt;input type="text" name="teacher_name" id="grade" value="" style="background:#f7f6f2 url(../images/input_02.png) repeat left top;border: 0px;width: 250px;height: 10px;padding: 10px;display: block;"&gt;
  &lt;input type="text" name="teacher_name" id="both" value="" style="background:#f7f6f2 url(../images/input_02.png) repeat left top;border: 0px;width: 250px;height: 10px;padding: 10px;display: block;"&gt;
  </code></pre>
  
  <p>what are the things i need to add to make my third input field to get updated. </p>