JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.min.js"></script>
  </head>

  <body>
    <h1>Quotes</h1>
    <div id="quotes">
      <!-- Quotes Here -->
    </div>
  </body>

</html>

CSS

p {
  font-style: italic;
  color: #444;
}

JavaScript

// Mocking some quote urls
const url = `https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=25`;
const numberOfUrls = 5;
const urls = Array(numberOfUrls).fill(url);

const getQuotes = async () => {
  const completeQuotesArray = [];
  // Request all URLs in parallels
  const quotesPromises = await Promise.all(urls.map(url => axios.get(url)));
	
  // See returned array with your resolved (or rejcted) promise values
  console.log(quotesPromises);
  
  // Since you've gotten the data all at once
  // You won't need to use await here
  // Now you can work with the data as you wanted
  for (const promiseValues of quotesPromises) {
    const quotesArray = promiseValues.data;
    for (let i = 0; i < quotesArray.length; i++) {
      const quote = quotesArray[i].content;
      if (quote.length < 150) {
        completeQuotesArray.push(quote);
      }
    }
  }

  return completeQuotesArray;
}

// Mock driver to render the quotes
const renderQuotes = async () => {
  const quotes = await getQuotes();
  let quotesHtml = '';
  quotes.forEach(quote => {
    quotesHtml += quote;
  });
  document.querySelector('#quotes').innerHTML = quotesHtml;
}

renderQuotes();