JSFiddle - React, Tailwind, and code Playground

HTML

<select multiple="multiple" name="paises[]"> 
    <option class="clasestado" value="AF">Afganistan</option> 
    <option class="clasestado" value="AL">Albania</option> 
    <option class="clasestado" value="DE">Alemania</option>
    <option class="clasestado" value="AD">Andorra</option> 
    <option class="clasestado" value="AO">Angola</option> 
    <option class="clasestado" value="MX">Mexico</option> 
</select> 

<select class="ocultoestado" id="selectestado" name="estados"> 
    <option value="Aguascalientes">Aguascalientes</option> 
    <option value="Baja California">Baja California</option> 
    <option value="Baja California Sur">Baja California Sur</option> 
    <option value="Campeche">Campeche</option> 
</select>

CSS

.ocultoestado{
    display: none;
}

JavaScript

var opciones = document.getElementsByName("paises[]")[0],
    mexico = document.getElementById("selectestado");

opciones.addEventListener("click", function(){
    mexico.style.display = this.value == "MX" ? "block" : "none";
}, false);