kiramishima/app.js

## app.js
function ConstruirPiramide(n)
{
  var ladrillo = {
    a: '<span class="bloque bloque-a"></span>',
    b: '<span class="bloque bloque-b"></span>',
  };

  var contenedor = document.getElementById("contenedor");

  /* Implementar tu código */
  var ar = new Array(n);
  for(var i = 0; i < n; i++){
    ar[i] = n - i;
  }
  var coll = ar.reverse().slice(0);

  (function insertOne() {
    var record = coll.splice(0, 1)[0];
    var index = ar.indexOf(record), i = 0, html = "";
    while(i < record){
      html += i % 2 === 0 ? 1 : 0;
      i++;
    }
    ar[index] = html.split("").reverse().join("").replace(/1/g, ladrillo.a).replace(/0/g, ladrillo.b);
    if (coll.length !== 0) {
      insertOne();
    }
  })();
  contenedor.innerHTML = ar.join('<br/>');
}

ConstruirPiramide(20);

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Pirámide - Reto #2</title>
  <style>
    @import url(http://fonts.googleapis.com/css?family=Roboto+Condensed);
            body{font-size:14px;font-family:Tahoma;padding:15px;font-family:Roboto Condensed;background:#eee;}
            .bloque{width:20px;height:20px;display:inline-block;border:1px solid #ccc;box-shadow:1px 1px 1px #ccc;margin:0;padding:0;}
            .bloque-a{background:red;}
            .bloque-b{background:green;}
            #contenedor{width:600px;height:530px;background:#fff;border:1px solid #ddd;padding:20px 0px;display:table-cell;vertical-align:middle;text-align:center;}
  </style>
  <script src="app.js"></script>
</head>
<body>
  <div id="contenedor"></div>
</body>
</html>
	function ConstruirPiramide(n)
	{
	var ladrillo = {
	a: '<span class="bloque bloque-a"></span>',
	b: '<span class="bloque bloque-b"></span>',
	};

	var contenedor = document.getElementById("contenedor");

	/* Implementar tu código */
	var ar = new Array(n);
	for(var i = 0; i < n; i++){
	ar[i] = n - i;
	}
	var coll = ar.reverse().slice(0);

	(function insertOne() {
	var record = coll.splice(0, 1)[0];
	var index = ar.indexOf(record), i = 0, html = "";
	while(i < record){
	html += i % 2 === 0 ? 1 : 0;
	i++;
	}
	ar[index] = html.split("").reverse().join("").replace(/1/g, ladrillo.a).replace(/0/g, ladrillo.b);
	if (coll.length !== 0) {
	insertOne();
	}
	})();
	contenedor.innerHTML = ar.join('<br/>');
	}

	ConstruirPiramide(20);
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Pirámide - Reto #2</title>
	<style>
	@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed);
	body{font-size:14px;font-family:Tahoma;padding:15px;font-family:Roboto Condensed;background:#eee;}
	.bloque{width:20px;height:20px;display:inline-block;border:1px solid #ccc;box-shadow:1px 1px 1px #ccc;margin:0;padding:0;}
	.bloque-a{background:red;}
	.bloque-b{background:green;}
	#contenedor{width:600px;height:530px;background:#fff;border:1px solid #ddd;padding:20px 0px;display:table-cell;vertical-align:middle;text-align:center;}
	</style>
	<script src="app.js"></script>
	</head>
	<body>
	<div id="contenedor"></div>
	</body>
	</html>