ChangeImageOnDropdown.html

<img id="embeddedImage" src="placeholder.png" />
<select id="genderDropdown" onchange="changeImage(this)">
    <option value="male">Male</option>
    <option value="female">Female</option>
    <option value="other">Other</option>
</select>


<script type="text/javascript">
    
const image = document.getElementById('embeddedImage'); 
function changeImage(dropdown) {
    let gender = dropdown.value();
    if (gender == 'male') {
        image.src = 'male.png';
    } else if (gender == 'female') {
        image.src = 'female.png';
    } else if (gender == 'other') {
        image.src = 'whatever.png';
    }
}

</script>