title: Why is this object property undefined?
body: <p>Consider the code below. The first <code>console.log</code> correctly logs the image, and you can see its properties in the image below. However, when I try logging one if its properties to the console, I get <code>undefined</code>!</p>
  
  <pre><code>console.log(that.data[0].cards); //works -- see image below
  console.log(that.data[0].cards.E); //undefined
  console.log(that.data[0].cards['E']); //undefined
  console.log(that.data[0].cards.hasOwnProperty('E')); //false
  
  var test = JSON.stringify(that.data[0]);
  console.log(test); // {}
  
  for( var key in that.data[0].cards ) {
      console.log('hello????') //doesn't appear in the console
  }
  
  console.log( Object.keys( that.data[0].cards ) ); //[]
  console.log( that.data[0].cards.propertyIsEnumerable("E") ); //false
  console.log( that.data[0].cards.__lookupGetter__( "E" ) ); //undefined
  </code></pre>
  
  <p>The result in the console:</p>
  
  <p><img src="https://i.stack.imgur.com/P1FiR.png" alt="enter image description here"></p>
  
  <p>Any idea what's going on here? The <code>xml</code> property inside of <code>that.data[0]</code> should also have properties inside of it -- named the same, in fact, as the properties in <code>cards</code>.</p>
  
  <p>FWIW, I get the same thing in Firebug (the above console image is Chrome).</p>