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?
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>