Change Text with Click Events - can't replicate in project

1

Tell us what’s happening:

I"m trying to replicate this process in my Random Quote Generator, but having trouble figuring out what exactly I’m supposed to do. All of the lessons in this section involve nothing more than copy-pasting a given batch of code without explaining what it does and why in any way! So, given that I copy-pasted that same code into my quote generator, changed the ids and classes to the ones in my project - I caught that at least - and since I’m clicking my button and the html is not changing as per the example, I haven’t the slightest idea how to proceed.

Your code so far
HTML

<p>Click the button for a random quote!</p>

<div class ="quotebox">
	The quotebox is here.
</div>
<button id="quotebutton">Push for new quote</button>

Javascript:

 $(document).ready(function() {
    $("#quotebutton").on("click", function(){

      $(".quotebox").html("Here is the message");

    });
  });

Your Browser User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.132 Safari/537.36.

Link to the challenge:
https://www.freecodecamp.org/challenges/change-text-with-click-events

1 Like
2

The code you pasted works fine and displays the static message on the first click. Do you have jquery loaded into your project ? what console.log errors are you getting ?

1 Like
3

No, I don’t have jQuery - need to edit that in settings? Where can I get a console.log going too?

4

Also - is there somewhere I should be learning the ins and outs of jQuery apart from FCC? I’m not sure if some of the exercises are missing or something, or I just need to be proactive and seek out this info

5

yeah, your code is using jquery , so you need to add it, if you are using codepen go to settings > javaScript > Quick- add and select jquery. if you are not using codepen then you can use the jquery cdn to add in between your head tags. console.log output is printed out to your browser’s developer tools, google it.

just learn as much as you can, the confusion is part of the learning process and normal, also learn how to search things effectively with google, and as usual feel free to post questions here.

1 Like
6

Cool. That helps a ton., thanks!