<div id = 'state'>
<%= select_tag :state, options_for_select(us_states) %>
</div>
<br>
<div id = 'prov' >
<%= select_tag :provinces, options_for_select(canadian_provinces) %>
</div>
<br>
<div id = 'country'>

<%= select_tag  :country, options_for_select(country), :onchange => "myFunction()" %>
</div>


<script>
function myFunction() {$(this).find(":selected").val();

if (this.val = 'CAN')
  var y = document.getElementById("prov");
  if (y.style.display === "none") {
    y.style.display = "block";
  } else {
    y.style.display = "none";
  }
  }

  else
  {

  var x = document.getElementById("state");
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
  }
  }


</script>