Company logo
  • Jobs
  • Bootcamp
  • About Us
  • For professionals
    • Home
    • Jobs
    • Courses
    • Questions
    • Teachers
    • Bootcamp
  • For business
    • Home
    • Our process
    • Plans
    • Assessments
    • Payroll
    • Blog
    • Calculator

0

66
Views
async function for advice generator

All code is working well but whenever I click the button to generate an advice, the advice is delayed and it's not showing in my site whenever the circle is clicked.

Is there a way for me to sync perfectly the button and the generated advice ?

How can I improve my code?

const number = document.querySelector(".number");
const advice = document.querySelector(".advice");
const circle = document.querySelector(".circle")

async function randomAdvice() {
  try {
    const random = await fetch("https://api.adviceslip.com/advice");
    console.log(random)
    const adviceGenerated = await random.json();
    console.log(adviceGenerated)
    number.textContent = `#${adviceGenerated.slip.id}`;
    advice.textContent = `"${adviceGenerated.slip.advice}"`;

  } catch (e) {
    console.log(e)
  }
}
randomAdvice();

circle.addEventListener("click", () => {
  randomAdvice()
});
<button class="circle">Circle</button>
<div class="number"></div>
<div class="advice"></div>

7 months ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post job Plans Our process Sales
Legal
Terms and conditions Privacy policy
© 2023 PeakU Inc. All Rights Reserved.