title: Calling a javascript function, value returns as undefined in the console
body: <p>So I have a city dropdown which is populated by an onchange, I am trying to get it so that it doesn't require the onchange every time the page reloads, since it is a form.</p>
  
  <p>this is the states dropdown, which works.</p>
  
  <pre><code>&lt;p id=stateDiv&gt;&lt;label&gt;State&lt;/label&gt;&lt;/p&gt;&lt;p&gt;&lt;select name='States' id='States'  onchange='getCity(this.value)'&gt;
              " . $states . "
          &lt;/select&gt;&lt;/p&gt;";
  </code></pre>
  
  <p>this is the city drop down function call which does not work. I am new to javascript, so I am not sure about how to format a call with php.</p>
  
  <pre><code>if($state==""){   
  echo '&lt;p id="citydiv"&gt;&lt;/p&gt;';
  }else{
      echo '&lt;p id="citydiv"&gt;&lt;script type="text/javascript"&gt;getCity('.$state.');&lt;/script&gt;&lt;/p&gt;';
  }
  </code></pre>
  
  <p>getCity function</p>
  
  <pre><code>function getCity(stateId)
  {
    var strURL="findcity.php?state="+stateId;
    var req = getXMLHTTP();
   if (req)
   {
    req.onreadystatechange = function()
    {
      if (req.readyState == 4) // only if "OK"
      {
        if (req.status == 200)
        {
          document.getElementById('citydiv').innerHTML=req.responseText;
         } else {
           alert("There was a problem while using XMLHTTP:\n" + req.statusText);
         }
      }
     }
     req.open("GET", strURL, true);
     req.send(null);
   }
  }
  </code></pre>