​

 var num=1;

 var tablesize=15;

 var maxi=(tablesize -1)/2 +1;

$(document).ready(function () {

  console.log("starting");

  var workarea=$("#workarea");

  var table=$("<table class='pyramid'/>");

​

  for (var i = 1; i<=tablesize;i++) {

    renderrow(table,(i<=maxi)?i:(tablesize-i+1));

  }

​

  console.log("table");

  workarea.append(table);

});

​

function renderrow(table,i) {

    var column;

    var row=$("<tr/>");

    table.append(row);

    for (var j=1;j<=tablesize;j++) {

      column=$("<td/>");

      if (j>maxi-i && j<=tablesize-(maxi-i)) {

        column.html(num);

        column.addClass("occupied");

        num++;

      }

      row.append(column);

    }  

}