jQuery Not Appending Object Values

Question

So I'm currently building a random quote generator and whenever I try to append values from my object, it just returns:

[object Object]

Here's my code:

$("#quoteBubble").append("<p>" + quotes[Math.floor(Math.random() * quotes.length)] + "</p>");

Also, here's the general layout of my object/array:

var quotes = [{
"quote": "eeyyy sik beets yo.",
"author": "Jamen Marz"
},

If anyone here could help me solve my issue, that would be greatly appreciated :D

Edit: Here's a link to my CodePen - http://codepen.io/Jelani/pen/ojYZaa?editors=101

L. Monty · Accepted Answer · 2015-10-06 20:33:05Z

3

You need to access the property yet. Change it to $("#quoteBubble").append("<p>" + quotes[Math.floor(Math.random() * quotes.length)].quote + "</p>"); to access the quote property

or if you really like to get the string-notation of the object use JSON.stringify(...) like

$("#quoteBubble").append("<p>" + JSON.stringify(quotes[Math.floor(Math.random() * quotes.length)]) + "</p>");

answered Oct 6, 2015 at 20:33

L. Monty

8829 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Patrick Evans · Accepted Answer · 2015-10-06 20:31:43Z

3

You have an array of objects, so

quotes[Math.floor(Math.random() * quotes.length)]

is going to return one of the objects in that array, like

{
    "quote": "eeyyy sik beets yo.",
    "author": "Jamen Marz"
}

As is, your code is trying to print the object itself, not one of the properties you have defined in it. So you need to specify the property you want to have printed out, ie

quotes[Math.floor(Math.random() * quotes.length)].quote 
//or
quotes[Math.floor(Math.random() * quotes.length)].author

answered Oct 6, 2015 at 20:31

Patrick Evans

42.8k6 gold badges81 silver badges94 bronze badges

Comments

Thiago Petrone · Accepted Answer · 2015-10-06 20:36:55Z

2

This is because your quote variable is actually an array of objects. Being so, calling quotes[0] brings an object with two properties. Calling quotes[n].quote will bring the quote itself and calling quote[n].author will bring the author from the same quote. (0 < n < quotes.length)

answered Oct 6, 2015 at 20:36

Thiago Petrone

3133 silver badges12 bronze badges

Collectives™ on Stack Overflow

jQuery Not Appending Object Values

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related