Toggle between a textbox and a select using PHP

<div id="state_inputs">
    <div id="us_states_div">
        <!-- Select box for US states goes here -->
    </div>
    <div style="display:none" id="ca_states_div">
        <!-- Select box for US states goes here -->
    </div>
    <div style="display:none" id="other_states_div">
        <input type="text" name="other_states" />
    </div> 
</div>

<script>
document.getElementById("country_select").onchange = function() {
        var country_select = document.getElementById("country_select");
        var country = country_select.options[country_select.selectedIndex].text;

        if(country == "USA") {
            document.getElementById("us_states_div").style.display="block";
            document.getElementById("ca_states_div").style.display="none";
            document.getElementById("other_states_div").style.display="none";
        } else if(country == "Canada") {
            document.getElementById("us_states_div").style.display="none";
            document.getElementById("ca_states_div").style.display="block";
            document.getElementById("other_states_div").style.display="none";
        } else {
            document.getElementById("us_states_div").style.display="none";
            document.getElementById("ca_states_div").style.display="none";
            document.getElementById("other_states_div").style.display="block";
        }
    };
</script>