Estoy tratando de reemplazar el contenido de texto de dos divs ("ciudad" y "presupuesto"), uno con una ciudad aleatoria de EE. UU. de una matriz y otro con un número generado aleatoriamente. El código funciona bien cuando lo ejecuto en la consola, pero por alguna razón no se muestra en el navegador. ¿Alguna idea de lo que está yendo mal aquí? Para mis propósitos, no estoy usando JQuery, solo 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; }Los problemas son:
getElementsByClassName .. en el parámetro de getElementsByClassName .usCitiesEsto debería funcionar:
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>