title: get selected item from a dropdown list and save it to a php variable
body: <p>I have a dropdown list(in a php file and without form tag)</p>
  
  <pre><code>print "&lt;select id="animal" onchange="getSelectedItem(this.value)"&gt;
  &lt;option value = "Dog"&gt; Dog &lt;/option&gt;
  &lt;option value = "Cat"&gt; Cat &lt;/option&gt;
  &lt;/select&gt;";
  </code></pre>
  
  <p>and a variable $selAnimal</p>
  
  <p>and a javascript function</p>
  
  <pre><code>function getSelectedItem(opt){
      //$selAnimal = opt &lt;- how do i do this?
  }
  </code></pre>
  
  <p>As much as possible I wouldn't like the page to reload so I avoid putting this inside a form and submitting as I select. I can't get to make $.post method work. I know for a fact that this cannot be directly done since php is server side and javascript is client side. 
  I also thought of putting the selected value inside a hidden component(span or something) and get the value from it. But I have no idea how to get it from the component. I've also seen use of AJAX or jquery but I'm not really knowledgeable enough.</p>
  
  <p>I need to save this value to the php variable since I'll be using it as basis for the options in my second dropdown. For example, if I choose Dog, the dropdown list would have dog breeds as options.</p>
  
  <p>I've spent days looking for possible solutions everywhere. Help would be very much appreciated. Thank you!</p>