create table

HTML

<a href="#" class="button"> Click Here! </a>

<div class='wrapper'>
  <table class="bones">
  
  </table>
</div>

CSS

.button {
  text-align: center;
  text-decoration: none;
  display: block;
  padding: 20px;
  width: 100px;
  margin: 0 auto;
  margin-bottom: 10px;
  background-color: black;
  color: white;
}

.wrapper {
  height: 300px;
  width: 300px;
  background-color: red;
  margin: 0 auto;
}

.block {
  background-color: white;
  height: 20px;
  width: 20px;
  padding: 10px;
  border: solid 0.1px;
}

JavaScript

$(document).ready(function() {
	//cache all jquery objects in variables
  var $button = $('.button');
  var $wrapper = $('.wrapper');
  var $bones = $('.bones');
  var $rows = $('.rows');
  
	
  $button.click(function() {
  
  	//prompt user for input on table size
    var inp = prompt("Enter a number");
    
    for (var i = 0; i < inp; i++) {
    	
      $bones.append("<tr class='rows'></tr>");
      
      $rows.append("<td class='block'></td>");
      
    };
    
    
    
  });
  
});