Random Quote Machine [CSS]

1

I am having a problem with my RQM. I have a

. The problem is when I retrieve the data via ajax the blockquote formatting does not work for the retrieved quotes…

Here is the link to my codepen: https://codepen.io/technobrat/pen/rwywgW

Any help is appreciated. Thanks.

2

Well, I would change your last line to:
from:

    $(".text").html(content);

to:

    $(".text").html("<blockquote>" + content + "</blockquote>");

you’re overwriting that element without the blockquote inside it.

1 Like
3

There are some other problems to address. For example, I get this error in the console:

index.html?editors=1010:121 Uncaught ReferenceError: getRandomColor is not defined
at HTMLButtonElement.onclick

But it is not clear to me why. It is defined, right before it’s call, and appears to work. But if I move that function definition out to the global scope, the error disappears.

Also, the id for one of your buttons is “button”. That is bad practice. What if you came back a year from now to your program and needed to add more buttons? Or someone else had to debug it and figure out what it is? Names should be descriptive. Something like “quote-button” would be better.

Looking at your code, there are two seperate AJAX calls to the quotesondesign.com site. These are doing the same thing so they should be combined. All of this should be wrapped in a function.There is a principle in programming - D.R.Y. - Don’t Repeat Yourself. It’s not always possible to follow perfectly, but it is a good goal.

I would consider having a function like newQuote() and that would make the API call and output the new quote to the string. You would call that function at the start of the program and again inside the click handler for the button.

1 Like
4

Thanks you so much. It works purrrrrrrrrrrrfectly. Thanks for the suggestions. I am aware of the two calls. I copy and pasted it and left just in case there was an error in posting. I will clean it up. Regarding the function for some reason it was not working so I pasted the code in the button. I will clean up for sure. Just trying to make the different parts work for now, Thanks again for you good counsel.

1 Like