Hello Mate,
I am trying to binding JSON data on quote button but it does not work. If any help pls.
Here is my code:
$(document).ready(function(){
$("#nextQuote").on(“click”,function getData(quote,author){
$.getJSON(“http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?", function(json) {
quote = json.quoteText;
author = json.quoteAuthor;
$(”.quoteText").html="
" + quote + “
”;});
});
});
can you share your codepen link?
<a href:“https://s.codepen.io/fotonist/debug/YGpvvZ”>Here is the link. I think the link does not work:
.html is a function, so put the quote in parentheses.
$(".quoteText").html("<p>" + quote + "</p>");
Also, prefix quote and author with the var keyword.
var quote = json.quoteText;
var author = json.quoteAuthor;
I did like you showed
quote = json.quoteText;
author = json.quoteAuthor;
Remember to format your code when you post here, especially if it contains HTML code. The forum editor uses HTML to format posts. That’s why the <p> tags in your post were not visible.
How can I format my code for the HTML?
$(document).ready(function(){
$("#nextQuote").on(“click”,function getData(quote,author){
$.getJSON(“http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?", function(json) {
quote = json.quoteText;
author = json.quoteAuthor;
< $(”.quoteText").html("
" + quote + “
”); >});
});
});
$(document).ready(function(){
$("#nextQuote").on(“click”,function getData(quote,author){
$.getJSON(“http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?", function(json) {
quote = json.quoteText;
author = json.quoteAuthor;
$(”.quoteText").html( quote );
$(".quoteAuthor").html( author );
});
});
});
@fotonist @mikeale03 I’m pretty sure some HTML code are lost in your posted code.
Try typing 3 backticks (the character that looks like an apostrophe), then press Enter twice.
Then type 3 backticks again. Then type the code in between.
Example
```
$(document).ready(function(){
$("#nextQuote").on(“click”,function getData(quote,author){
…
```
It should look like this:
$(document).ready(function(){
$("#nextQuote").on("click",function getData(quote,author){
...
Ok now I learned. Here is my code:
$(document).ready(function(){
$("#nextQuote").on("click",function getData(quote,author){
$.getJSON("http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?", function(json) {
quote = json.quoteText;
author = json.quoteAuthor;
$(".quoteText").html("<p>" + quote + "</p>");
$(".quoteAuthor").html("<em>-" + author + "</em>");
});
});
});
@kevcomedia thanks!
$(document).ready(function() {
$("#nextQuote").on("click",function getData(quote,author){
$.getJSON("http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?", function(json) {
var quote = json.quoteText;
var author = json.quoteAuthor;
$(".quoteText").html("<p>"+ quote+"<p>" );
$(".quoteAuthor").html( "-"+ author +"-" );
});
});
});
I think this works. 
Just add the var keyword on the lines where you set the text and author.
var quote = json.quoteText;
var author = json.quoteAuthor;
@kevcomedia, nothing changed. Will you see my project code?
That’s weird 
. It was working a while ago.
I inserted a console.log in the callback. Nothing gets printed to the console when I click the button. It seems the API call fails.
I opened the pen on http. It works now.
How does it work? I do not find out where is my mistake Because it still does not work 
You are probably viewing your pen on https. View it with this url
http://codepen.io/fotonist/pen/YGpvvZ?editors=0011
