How to let my HTML input be used by my JavaScript function?

So I have set up many objects with my JavaScript, a HTML dropdown list so you can select which pokemon

As you can see I have tried to access the ‘bulbasaur’ object by using document.getElementById on a list which has a dropdown value of ‘bulbasaur’. When I do console.log(mon) it prints ‘bulbasaur’ so I’m guessing I just can’t access the object this way. Is there a workaround? Thanks

const base =10;
class Pokemon {
  constructor(name, shinyrate) {
    this.name = name;
    this.shinyrate = shinyrate;
  }
}
const bulbasaur = new Pokemon('Bulbasaur', base);

function shundoWild() {
  let mon = document.getElementById("list").value;
  let nowb = mon.shinyrate * ivCombinations(ivFloor.wild);
  let wb = mon.shinyrate * ivCombinations(ivFloor.weatherBoost);
  document.getElementById("print").innerHTML = ("The chance to get a SHUNDO " + mon.name + " wild catch is ~1/" + wb + " when weather boosted, or ~1/" + nowb + " when not weather boosted.")
}
<select id="list" onchange="shundoWild();">
  <option value="bulbasaur">Bulbasaur</option>
  <option value="ekans">Ekans</option>
</select>

51 thoughts on “How to let my HTML input be used by my JavaScript function?”

Leave a Comment