title: Datalist - limit to dispay only x-amount of options
body: <p>So I have this html datalist that consists of almost 6000 options, something like the example bellow.</p>
  
  <p>The problem is it opens up A LOT options over your browser and I only require about 10 to be visible at a time and it needs to be a field that auto-completes when you start typing </p>
  
  <p>Is there any way to display only the top 10 options that returns from the list?</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>for (i = 0; i &lt; 6000; i++) { 
      $('#myList').append("&lt;option value=Example'"+i+"'&gt;&lt;/option&gt;");
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;input list="myList"&gt;
  
  &lt;datalist id="myList"&gt;
  &lt;/datalist&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I found <a href="https://stackoverflow.com/questions/15097563/limit-total-entries-displayed-by-datalist">this</a> post from 3 years ago but it is too slow to use on my amount of options. Was hoping someone found a better(faster) solution or at least an alternative solution since.</p>