title: Ajax dependant dropdownlist using mysqli and html select tags, return value even when select tags are not closed
body: <p>i am having a problem in which the code that i wrote are working as the way I wanted when there is 2 dependant drop down but when i want to add a third dependant dropdown i realize that my code had gone wrong on the select tag (the select tag are not closed), But it works??</p>
  
  <p>I dont understand why my codes work when the select tag is not closed, but my codes dont work when the select tag is closed @ line 43</p>
  
  <pre><code>&lt;head&gt;
  
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"&gt;&lt;/script&gt;
  
  &lt;script&gt;
  
  function getState(val) {
      $.ajax({
      type: "POST",
      url: "index.php",
      data:'country_id='+val,
      success: function(data){
          $("#state-list").html(data);
      }
      });
  } 
  
  &lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;?php 
  
  $conn = new mysqli("localhost", "root", "", "dropdowndb");
  
  if ($conn-&gt;connect_errno) {
      echo $conn-&gt;connect_error;
  }
  
  $query = "SELECT * FROM country";
  
  $result = mysqli_query($conn, $query);
  ?&gt;
  
  &lt;select onChange="getState(this.value);"&gt;
  &lt;?php while ($row = $result-&gt;fetch_row()) { ?&gt;
      &lt;option value="&lt;?= $row[0] ?&gt;"&gt;&lt;?= $row[1] ?&gt;&lt;/option&gt; 
  &lt;?php } ?&gt;
  &lt;/select&gt;   
  
  &lt;select name="state" id="state-list"&gt;
      &lt;option value=""&gt;Select State&lt;/option&gt;    
  
  &lt;?php if(!empty($_POST["country_id"])): ?&gt;
  
      &lt;?php
          $query ="SELECT * FROM state WHERE country_id = '" . $_POST["country_id"] . "'";
          $result = mysqli_query($conn, $query);
      ?&gt;
      &lt;select&gt;
      &lt;?php while ($row = $result-&gt;fetch_row()) { ?&gt;
          &lt;option value="&lt;?= $row[0] ?&gt;"&gt;&lt;?= $row[1] ?&gt;&lt;/option&gt; 
      &lt;?php } ?&gt;
      &lt;/select&gt;   
  
  &lt;?php endif ?&gt;  
  </code></pre>