title: Why is my Javascript for loop not looping?
body: <p>I'm trying to write a for loop that splits an array (parameter: arr) into sub-arrays of a given size (parameter: size), but it seems to be exiting the for loop early/not actually looping back in. </p>
  
  <p>This code should return <code>[['a', 'b'] ['c', 'd']]</code>, but right now is only returning <code>[['a', 'b']]</code>. </p>
  
  <p>I've tried researching but I can't pinpoint what in my code is stopping the loop from going back through the array.  </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>function chunkArrayInGroups(arr, size) {
    var newArr = [
      []
    ];
    for (var i = 0; i &lt; arr.length; i++) {
      newArr[0].push(arr.shift(arr.slice(i, size)));
    }
    return newArr;
  }
  
  //calling the function:
  console.log(chunkArrayInGroups(['a', 'b', 'c', 'd'], 2));</code></pre>
  </div>
  </div>
  </p>
  
  <p>Please help me figure this out. </p>