title: Why am i getting this error: "Uncaught TypeError: Cannot read property 'Title' of undefined"?
body: <p>I am trying to write an <strong>ajax</strong> web app. I have a function that is suppose to request a <strong>json</strong> object and then use it to re/populate the website.</p>
  
  <p>Here is the <strong>Javascript</strong> in Question <strong>(Lines 8 - 16)</strong>:</p>
  
  <pre><code>window.onload=LoadData("Home", {});
  var _doc = {};
  function LoadData(page, params) {
      $.get(page, params, function ( data ) { 
          _doc = jQuery.parseJSON( data ); 
          }
      );
      document.title = _doc.Title.Title;
  };
  </code></pre>
  
  <p>Here is the error <strong>Chrome</strong> gave:</p>
  
  <pre><code>Uncaught TypeError: Cannot read property 'Title' of undefined
  LoadDatahttp://127.0.0.1/:15
  (anonymous function)
  </code></pre>
  
  <p>This is what has me confused if I run the same statement in the console:</p>
  
  <pre><code>document.title = _doc.Title.Title;
  "Home"
  </code></pre>
  
  <p>And it changes the title to Home</p>
  
  <p>Here is proof that its not undefined:</p>
  
  <pre><code>_doc
  Object
     Body: Object
        Menus: Array[4]
           0: Object
              Menu: Object
           1: Object
              Menu: Object
           2: Object
              Menu: Object
           3: Object
              Menu: Object
     Title: Object
        Title: "Home"
     User: Object
        Name: "Username"
  </code></pre>
  
  <p>And A screenshot as an overview:
  <img src="https://i.stack.imgur.com/Oh3gl.png" alt="This is What the Chrome Console Looks Like...">
  <strong>Note: the call to the function at the bottom did change the title</strong></p>