Question

0

179

Visualizações

element .innerText not displaying

I'm trying to replace the text content of two divs ("city" and "budget"), one with a random US city from an array and one with a randomly generated number. The code works fine when I run it in the console, but for some reason it won't display in the browser. Any idea what's going wrong here? For my purposes I'm not using JQuery, just straight JavaScript.

HTML:

<div id="result">
    <div class="city">
        <h1>City</h1>
    </div>
    <div class="budget">
        <h1>Budget</h1>
    </div>
</div>

JS

function city() {
    document.getElementsByClassName('.city').innerText = usCities[Math.floor(Math.random() * usCities.length)];
}

function budget() {
    document.getElementsByClassName('.budget').innerText = Math.floor(Math.random() * 1000000) + 100000;
}

about 4 years ago · Juan Pablo Isaza

1 Respostas

Responde à pergunta

0

Responde à pergunta

Encontrar trabalhos remotos

Accepted Answer · 2022-07-05T11:13:18.449Z

The problems are:

You doesn't give [0] to getElementsByClassName.
Using . in the paremeter of getElementsByClassName.
You doesn't call the function
You doesn't define the usCities

This should works:

let usCities = ["Chicago", "New York"]

function city() {
  document.getElementsByClassName('city')[0].innerText = usCities[Math.floor(Math.random() * usCities.length)];
}

function budget() {
  document.getElementsByClassName('budget')[0].innerText = Math.floor(Math.random() * 1000000) + 100000;
}
city();
budget();

<div id="result">
  <div class="city">
    <h1>City</h1>
  </div>
  <div class="budget">
    <h1>Budget</h1>
  </div>
</div>

0

179

element .innerText not displaying

1 Respostas

0

Encontrar trabalhos remotos

Andres GPT