title: Parse JSON from JQuery.ajax success data
body: <p>I am having trouble getting the contents of JSON object from a JQery.ajax call. My call:</p>
  
  <pre><code>$('#Search').click(function () {
      var query = $('#query').valueOf();
      $.ajax({
          url: '/Products/Search',
          type: "POST",
          data: query,
          dataType: 'application/json; charset=utf-8',
          success: function (data) {
              alert(data);
              for (var x = 0; x &lt; data.length; x++) {
                  content = data[x].Id;
                  content += "&lt;br&gt;";
                  content += data[x].Name;
                  content += "&lt;br&gt;";
                  $(content).appendTo("#ProductList");
                 // updateListing(data[x]);
              }
          }
      });
  });
  </code></pre>
  
  <p>It seems that the JSON object is being returned correctly because "alert(data)" displays the following </p>
  
  <pre><code>[{"Id": "1", "Name": "Shirt"}, {"Id": "2", "Name":"Pants"}]
  </code></pre>
  
  <p>but when I try displaying the Id or Name to the page using:</p>
  
  <pre><code>content = data[x].Id;
  content += "&lt;br&gt;";
  content += data[x].Name;
  content += "&lt;br&gt;";
  </code></pre>
  
  <p>it returns "undefined" to the page. What am I doing wrong?</p>
  
  <p>Thanks for the help.</p>