title: Share the same ajax result between three different sections/divs
body: <p>My ajax call is returning 27 results, and I need to split these results in to three equal parts, so 9 results for each sections, which are displayed below. </p>
  
  <p><strong>HTML:</strong> </p>
  
  <pre><code>&lt;div id="content"&gt;
  
     &lt;section&gt;
     &lt;/section&gt;
  
     &lt;section&gt;
     &lt;/section&gt;
  
     &lt;section&gt;
     &lt;/section&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JS</strong> looks roughly like this. Currently, all of the 27 results are going inside of every sections. How do I define the method for each of my sections to take only 9 results inside of them?</p>
  
  <pre><code>var query = "http://ajaxcallfromservice&amp;maxResults=27";
  $.ajax({
      url: query,
      async: true,
      dataType: "jsonp",
      success: function (result) {
          ajax.parseJSONP(result);
      }
  });
  
  var ajax = {
      parseJSONP : function(result) {
          $.each(result.items, function(i, row) {
                  $('section').append('&lt;h2'+ row.stuffWhatINeed +'&lt;/h2&gt;');                    
          });
      }
  }
  </code></pre>
  
  <p>Any advice would be greatly appreciated.</p>