title: Iterate object and array with for loop and add key/value pair
body: <p>I'm trying to understand how to iterate over an object that resembles the following:</p>
  
  <pre><code>var json = {"tsn": {
      "events": [
          {
            "title": "Lorem ipsum",  
            "description": "Dolor sit"
          },
          {
            "title": "Duis aute irure",  
            "description": "eu fugiat nulla pariatur"
          },
        ],
      "occurrence": [
          "Music",
          "Party"
        ]
      }    
  };
  </code></pre>
  
  <p>I would like to explicitly use a <code>for</code> loop as per the code below (and not <code>for in</code>)</p>
  
  <pre><code>for(var i = 0; i &lt; json.length; i++) {
      console.log(json.tsn.events[i].title);
  }
  </code></pre>
  
  <p>Why does the above code does not get all of <code>title</code>?  </p>
  
  <p>Secondly, how should I get all the <code>occurrence</code>?</p>
  
  <p>And lastly, how I can add to <code>events</code> a new key/value pair such as <code>{"image": "cat.jpg"}</code> so that the <code>json</code> object results like this:</p>
  
  <pre><code>var json = {"tsn": {
      "events": [
          {
            "title": "Lorem ipsum",  
            "description": "Dolor sit",
            "image": "cat.jpg"
          },
          {
            "title": "Duis aute irure",  
            "description": "eu fugiat nulla pariatur",
            "image": "dog.jpg"
          },
        ],
      "occurrence": [
          "Music",
          "Party"
        ]
      }    
  };
  </code></pre>