Why result doesn't display?

Hello Im trying to display the result but when I click any of the options on the dropdow, I just dont get anything, what Im doing wrong? Thanks
CODEPEN
html

<select id="bedrooms" onchange="changeddl(this)">
        <option>Choose beds</option>
        <option value="150">1 bed</option>
        <option value="200">2 beds</option>
        <option value="300">3 beds</option>
        <option value="400">4 beds</option>
      </select>
      
      <div id="divprice"></div>

js

function changeddl(this) {
    document.getElementById("divprice").text(this.value > 0?("price: $ " + this.value):"");
};

Hello @codeca423.

You cannot define an event listener in JavaScript console and apply it as HTML attribute like that. I recommend you use addEventListener method instead.

document.getElementById('bedrooms').addEventListener('change', changeddl);

function changeddl() {
   document.getElementById("divprice").innerText = (this.value > 0?("price: $ " + this.value):"");
};

And don’t pass this as parameter to the event listener. The first parameter to the event listener is the event object.

1 Like