title: Draw rectangles dynamically in SVG
body: <p>I would like to know how to draw 100 rectangles with SVG.</p>
  
  <p>I made one rectangle with this code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;body&gt;
  
    &lt;svg id="svgOne" xmlns="http://www.w3.org/2000/svg" width="5000" height="3000"&gt;
      &lt;rect x="50" y="50" width="50" height="50" fill="black" /&gt;
    &lt;/svg&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I woukd like to draw 100 of rectangles with same size, different position (like 10 in row and 10 rows). How to do it fast? Some loop?</p>