Assignment - Shapes

This assignment will have you working with the DOM, Strings, and Loops. The goal is to programmatically make 2 different tables and fill them with certain symbols. As you draw the shapes put a * inside of each cell to indicate you filled with something. Each td cell should only have one * in it.

The square table will be 10 cells wide and will be 10 cells tall. Every cell should be filled.
See the output image for an example.
Insert your table into the element with #square selector.

The triangle table will start as 1 cell wide and will grow to be 10 cells wide. No empty td elements should exist in this table. It should only have cells that are filled. You will draw a right angle triangle with the smallest corner in the top left. Each cell that makes up the triangle should use have the * character.
See the output image for an example.
Insert your table into the element with #triangle selector.

Output:

The what should be showing on the page: (One with the debugg css on so you can see the cells better)

The console.log output:

Square

Triangle