How does a JavaScript object have different keys and values when opened in the Firefox developer tools? [duplicate]

Question

I am creating a deck of card objects in JavaScript. Why do all the objects hold the same keys and values? Here is my code

                for(var i = 0; i<4; i++){
                    for(var j = 0; j<13; j++){
                        cardObj["Suit"] = arrSuits[i];
                        //console.log(arrSuits[i]);
                        cardObj["Value"] = arrCardNums[j];
                        //console.log(arrSuits[i]);
                        arrObjectCards.push(cardObj);
                    }
                }
                console.log(arrObjectCards);
            }

Here is a photo of my issue:

Anyone know the source of this error?