// Cast on 3 stitches
var dishcloth = [];
dishcloth.push(Array(3));

// Knit across
dishcloth[0].fill(1);

// Knit 1, knit front & back, knit 1
dishcloth.push(Array(4).fill(1));

//*K2, yo, knit to end.*
// Repeat from * to * until there are 45 stitches on your needle.
for (var j = 2; j < 45; j++) {
  var prow = dishcloth[j-1];
  var row = [];
  for (var k = 0; k <= prow.length; k++) {
    // Yarn over if it is the third stitch
    if (k === 2) {
      row.push(null);
    } else {
      // knit
      row.push(1);
    }
  }
  // As a pair of rows acts like a stack
  if (j % 2 == 0) {
    // push even rows on
    dishcloth.push(row);
  } else {
    // reverse odd rows and then push them on
    dishcloth.push(row.reverse());
  }
}

// Output dishcloth array on button click
function knit(event) {
  
  // just because I like to do this
  event.preventDefault();
  
  // create an empty string
  var cloth = "";
  
  for (var i = 0; i < dishcloth.length; i++) {
    // Add each internal array as a string to cloth with a break
    cloth += dishcloth[i].toString() + "<br />";
  }
  
  // Find the dishcloth element and replace it's innnerHTML with the value of cloth
  document.getElementById("dishcloth").innerHTML = cloth;
}