Question

0

173

Vistas

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 Respuestas

Responde la pregunta

0

Responde la pregunta

Encuentra empleos 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

173

element .innerText not displaying

1 Respuestas

0

Encuentra empleos remotos

Andres GPT