how can i show a different window depending on the option i choose from a selection combo?

Question

I have this code

And I want to show a different message when I click in one of these options.

    document.getElementById("specialityAppointmentSelection").addEventListener('onchange', function(){
         let specialityAppointmentSelection = document.getElementById("specialityAppointmentSelection");
         let specialityOption = specialityAppointmentSelection.value;
         console.log(specialityOption);
        if(specialityOption === "1"){
            console.log("medicina");
        } else {
            console.log("enfermería");
        }
     });

<p>Selecciona el tipo de cita que desee: </p>
        <select id = "specialityAppointmentSelection">
          <option value = "1">Medicina</option>
          <option value = "2">Enfermería</option>
        </select>

But I can't show anything in my console.log, what is the problem?

Answer 1

You should use change rather than onchange like so .addEventListener('change', function(){

document.getElementById("specialityAppointmentSelection").addEventListener('change', function(){
         let specialityAppointmentSelection = document.getElementById("specialityAppointmentSelection");
         let specialityOption = specialityAppointmentSelection.value;
         console.log(specialityOption);
        if(specialityOption === "1"){
            console.log("medicina");
        } else {
            console.log("enfermería");
        }
     });

<p>Selecciona el tipo de cita que desee: </p>
        <select id = "specialityAppointmentSelection">
          <option value = "1">Medicina</option>
          <option value = "2">Enfermería</option>
        </select>