Edit in JSFiddle

var comboCont = document.getElementById("continente"),
    comboPais = document.getElementById("pais"),
    comboCiud = document.getElementById("ciudad"),
    continentes = {
        America: {
            USA: ["San Francisco", "Seattle", "San Antonio"],
            Perú: ["Lima", "Tacna", "Cusco"],
            México: ["México D.F.", "Tijuana", "Guadalajara"]
        },
        Europa: {
            España: ["Barcelona", "Valencia", "Madrid"],
            Italia: ["Roma", "Venecia", "Milano"]
        }
    },
    cambiaCiudad = function(contVal, paisVal){
        var pais = continentes[contVal][paisVal];
  
        comboCiud.innerHTML = null;
  
        for (var j in pais){
            var opt = document.createElement("option");
            opt.value = pais[j];
            opt.innerHTML = pais[j];
            comboCiud.appendChild(opt);
        }
    },
    cambiaPais = function(contVal){
        var cont = continentes[contVal];
  
        comboPais.innerHTML = null;
  
        for (var i in cont){
            var opt = document.createElement("option");
            opt.value = i;
            opt.innerHTML = i;
            comboPais.appendChild(opt);
        }
      
        cambiaCiudad(contVal, comboPais.value);
    };

comboCont.addEventListener("change", function(){
    cambiaPais(this.value);
}, false);
comboPais.addEventListener("change", function(){
    cambiaCiudad(comboCont.value, this.value);
}, false);

cambiaPais(comboCont.value);

<section>
    Continente: 
    <select id = "continente">
        <option value = "America">América</option>
        <option value = "Europa">Europa</option>
    </select>
</section>
<section>
    País: <select id = "pais"></select>
</section>
<section>
    Ciudad: <select id = "ciudad"></select>
</section>