title: Limting Search Results in Jekyll Search
body: <p>I've been trying without success to limit results in the search script included in my site. </p>
  
  <p>Here is the original script: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>jQuery(function() {
    // Initialize lunr with the fields to be searched, plus the boost.
    window.idx = lunr(function () {
      this.field('id');
      this.field('title');
      this.field('content', { boost: 10 });
      this.field('categories');
    });
  
    // Get the generated search_data.json file so lunr.js can search it locally.
    window.data = $.getJSON('/search.json');
  
    // Wait for the data to load and add it to lunr
    window.data.then(function(loaded_data){
      $.each(loaded_data, function(index, value){
        window.idx.add(
          $.extend({ "id": index }, value)
        );
      });
    });
  
    // Event when the form is submitted
    $("#site_search").submit(function(event){
        event.preventDefault();
        var query = $("#search_box").val(); // Get the value for the text field
        var results = window.idx.search(query); // Get lunr to perform a search
        display_search_results(results); // Hand the results off to be displayed
    });
  
    function display_search_results(results) {
      var $search_results = $("#search_results");
  
      // Wait for data to load
      window.data.then(function(loaded_data) {
  
        // Are there any results?
        if (results.length) {
          $search_results.empty(); // Clear any old results
  
          // Iterate over the results
          results.forEach(function(result) {
            var item = loaded_data[result.ref];
  
            // Build a snippet of HTML for this result
            var appendString = '&lt;li&gt;&lt;a href="' + item.url + '"&gt;' + item.title + '&lt;/a&gt;&lt;/li&gt;';
  
            // Add the snippet to the collection of results.
            $search_results.append(appendString);
          });
        } else {
          // If there are no results, let the user know.
          $search_results.html('&lt;li&gt;&lt;b&gt;&lt;u&gt;NO RESULTS FOUND&lt;/u&gt;&lt;/b&gt;&lt;/li&gt;');
        }
      });
    }
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>And I've tried without success to include this limiting statement when iterating over the results:</p>
  
  <pre><code>        // Iterate over the results
      for (var i = 0; i &lt; results.length &amp;&amp; i &lt; 5; i++)  {
           var item = loaded_date[results[i]];
  </code></pre>
  
  <p>I've fiddled around for it for quite some time, and can't seem to find what is amiss. </p>
  
  <p>Any assistance is greatly appreciated.</p>
  
  <p>-d</p>