title: Change value of span tag onchange event jquery
body: <p>I am trying to change the value of span when the user selects an option from the dropdown but this doesn't seem to be working.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;tr&gt;
                      &lt;td class="field" colspan="4"&gt;
                      &lt;select id="mmt"&gt;
                      &lt;option value="Metric" selected&gt;METRIC&lt;/option&gt;
                      &lt;option value="English"&gt;ENGLISH&lt;/option&gt;
                      &lt;/select&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td class="head"&gt;&lt;label for="abc"&gt;ABC&lt;/label&gt;&lt;/td&gt;
                      &lt;td class="field"&gt;&lt;input type="text" id="abc"/&gt;&lt;span class="m"&gt;MM&lt;/span&gt; OD&lt;/td&gt;
                      &lt;td class="head"&gt;&lt;label for="pqr"&gt;&lt;/label&gt;&lt;/td&gt;
                      &lt;td class="field"&gt;&lt;input type="text" id="pqr" /&gt;&lt;span class="ms"&gt;MM&lt;/span&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td class="head"&gt;&lt;label for="xyz"&gt;XYZ&lt;/label&gt;&lt;/td&gt;
                      &lt;td class="field"&gt;&lt;input type="text"  id="xyz" /&gt;&lt;/td&gt;
                      &lt;td class="head"&gt;&lt;label for="stu"&gt;&lt;/label&gt;&lt;/td&gt;
                      &lt;td class="field"&gt;&lt;input type="text" id="stu"/&gt;&lt;span class="ms"&gt;MM&lt;/span&gt;&lt;/td&gt;
                  &lt;/tr&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>$(function() {          
                      $('#mmt').change(function() {
                          if ($('#mmt option:selected').text() == "English") {
                              $('.ms').text("INCH");
                          }
                          else {
                              $('.ms').text("MM")     
                          }
  
                      });
  
          });
  </code></pre>