Random Quote Machine - Need Help with jQuery

#1

Hello,

I’m attempting to build the Random Quote Machine. I’m currently trying to implement the “New Quote” button to change the text that appears on the screen. I haven’t been able to make this work at all and haven’t yet even tried to add an API. I’ve double checked the selectors in the jQuery code and looked over the JSON/API section on FCC multiple times but clicking on my “New Quote” button does not change my text at all. Any assistance would be appreciated!

Here’s my codepen:

https://codepen.io/Steve940/pen/JrvoKW

#2

Solved.

I had my jQuery code in between script tags in the HTML section. Moving the code into the javascript box solved the issue. Not sure why.

#3

It has to do with the way codepen loads the external libraries. You could have not added the JQuery library using the JS external files section and put the JQuery library reference directly in your HTML section (above your $(document).ready ) as:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

<script>
$(document).ready(function() {
  $("#newQuote").on("click", function(){
    $(".quoteText").html("Hello");
  });
});
</script>

and it would have worked fine.

1 Like
#4

I understand now. Thank you!

#5