title: Trying to make a reusable function to make cells in a row. (chess board)
body: <p>I'm trying to make the first row of a chess board. I had it but Im trying to make what I think what's called a constructor function to learn more advanced programming. I'm trying to get all the data in the function and append the div to the board the x should be updated by multiplying <code>i</code> * the piece size.I think I'm having problems using the new key word and appending together. If you could show me how you would fill up the whole chess board that would be great. I'm assuming you would use nested for loops. That's my next goal. </p>
  
  <p>I have something like this.</p>
  
  <pre><code>$(function(){
      var boardHeight = parseInt($(".board").css("height")),
      boardWidth = parseInt($(".board").css("width")),
      amountOfPieces =8,
      pieceSize = boardHeight / amountOfPieces,
      board = $(".board");
      console.log(pieceSize);
      function Cell(orange, x){
          this.width = pieceSize;
          this.height = pieceSize;
          this.color =  orange ?  "orange" : "black"
          this.x = x;
      }
      console.log( new Cell())
      for(var i = 0 ; i &lt; amountOfPieces; i++){
          if(i % 2 == 0){
              board.append($("&lt;div&gt;") new cell("orange", i * pieceSize))
          }else if( i % 2 == 1){
              board.append($("&lt;div&gt;").css({
                  position: "absolute",
                  width : pieceSize,
                  height: pieceSize,
                  "background-color" : "black", 
                  left: i * pieceSize
              }))
          }
      }
  });
  </code></pre>
  
  <p><strong>EDIT</strong>: ok guys I got the first row shown in my answer. now I need to fill in the whole board. Remember the colors need to alternate and I would prefer to use a nested for loop. Thanks.</p>