Augustus Augustus - 5 months ago 13x
HTML Question

creating multiple vertical lines in HTML using loops

I'm new to JS and would like to create 10 vertical lines in my webpage. I have written my HTML code as

<div id="verticle-line"></div>

and in my CSS I have

#verticle-line {
width: 1px;
min-height: 400px;
background: red;

How Can I create 10 such lines in my webpage using JavaScript?


There are many ways to do this but the easiest would probably be this:

for(var i=0; i<10; i++) {
  document.write('<div class="verticle-line"></div>');

Use a for loop to write 10 divs on your page. I also changed id to class, because you should not have more than one element with the same id on your page. Make sure you change your CSS to match a class.