单击按钮时如何显示来自特定API的新随机生成的报价？

Question

Problem- I have an API that displays a random quote once the page loads. My button(div) called "newQuote" doesn't generate a new quote, instead, it displays the exact same quote, making my button useless.

My code can be found on GitHub here SO- I have a javascript function, called getNewQuote() that runs when my page loads. This function grabs a quote and author from an API ( https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1 ), and appends it to my div with the class quoteTitle and quoteDisplay.

function getNewQuote() {
  $.ajax({
    url: 'https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1',
    jsonp: 'jsonp',
    cache: 'false',
    success: function(data) {
      var post = data.shift();
      $("#quoteTitle").empty();
      $("#quoteDisplay").empty();
      $("#quoteTitle").append(post.title);
      $("#quoteDisplay").append(post.content);
    }
  });
}

getNewQuote();

Then, I set another div called newQuote which, when clicked, would display a new quote.

$('#newQuote').on('click', function(e) {
  e.preventDefault();
  getNewQuote();

Now, to me, it seems that the problem is caching. The reason that I think it is a cache problem is because if I go to the site on my phone using the app Firefox Focus, which (pretty sure) doesn't store any cache, the site will run as wanted, and will change my quote whenever I click on my #newQuote. You can try it for yourself at 'rqg.ronlaniado.me', where it is hosted.

Since my problem is cache, I did use some methods and plans to avoid this.

    cache: 'false',

I set cache-ing to false in my .ajax request.

  <script src="qg_js.js?v=42"></script>

I put "?v-42 which, according to Google, shouldn't keep cache stored.

If anyone can look through my code and assist me in solving my issue, that'd be great. Also, this is my first time posting here, so sorry if I am a bit messy with everything.

Answer 1

The error was here:

cache: 'false';

The correct usage is:

cache: false;

These quotes caused cache to be kept, meaning that the quotes didn't change.