Creating multiple divs with decreasing numbering every tenth

Question

I want to create multiple divs. The id of the divs should be decreasing, but not immediately; Like not id 5,4,3,2,1. I would like to create 10 divs with id 10 then 10 divs with id 9 and so on. So it shouldn't decrease by one immediately. Ultimately I'd like 100 divs.

The whole point is that I want to create a coordinate system. So 10 divs should be 10,1 10,2 10,3 10,4... And then when it reaches 10,10 I want it to create 9,1 9,2 9,3...

your question doesn't make any sense, Id's need to be unique so you cant have 10 divs with an id of 10. you can use classes. — DCR, Jan 14 '20 at 19:51
thanks for such an early answer :) I updated the post to try to explain the problem better. Please read it again and ask again if something is unclear. I'm a beginner on programming so I have no idea how to ask the question for you guys to understand it. — Emil Sunnerdahl, Jan 14 '20 at 19:56
rather than re-allocating the div's ID you can try to feed the div IS's in to an array and then 'pop' off the highest one. You will likely want to accomplish this with Javascript. — Michael Nelles, Jan 14 '20 at 19:57
how would that be done? (is it possible to reply to a comment or should I just post another comment as a reply?) — Emil Sunnerdahl, Jan 14 '20 at 19:58
your question still doesn't make sense. It is inadequately specified. Do you want the 10 divs nested? or is it just 100 div's — DCR, Jan 14 '20 at 20:07
You cannot have multiple elements with the same ID; per the HTML spec, the ID attribute must be unique. — TylerH, Jan 14 '20 at 20:14
but if I have a coordinate system like I said with the following ids: 10,1 10, 2 10,3. Then the id's aren't the same. Yes, the number ten will be in ten divs after each other but the number after will be different — Emil Sunnerdahl, Jan 14 '20 at 20:33

score 0 · Answer 1 · answered Jan 14 '20 at 20:10

0

Are you looking for something like this?

for (var i = 10; i > 0; i--) {
  for (var j = 1; j <= 10; j++) {
    $("#wrapper").append("<div id=" + i + j + ">DIV " + i + " " + j + "</div>");
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="wrapper"></div>

answered Jan 14 '20 at 20:10

darkhouse

205
5
15

will this create the divs inside the html document just while running the program or will they be there like all other elements? – Emil Sunnerdahl Jan 14 '20 at 20:14
if you want it to load at the start of the web page, put the js code inside `$(document).ready(function(){ //jscode here });` – darkhouse Jan 14 '20 at 20:17
if you want it on the click of a button just put it on a `$(#buttonid).click(function(){//jscode here})` – darkhouse Jan 14 '20 at 20:18
I mean can I run this in my editor somehow so this will pop up in my body tag in my html document? Or does it already do that? – Emil Sunnerdahl Jan 14 '20 at 20:27
Another question: will the for loop run automatically when the website runs or do I need to call it like I do with functions – Emil Sunnerdahl Jan 14 '20 at 20:29
you run it in your browser. It gets generated by javascript. If you want you can right click the browser window and inspect the html, you can copy and paste what you inspect into your editor – DCR Jan 14 '20 at 20:30
OMG! THANK YOU SO MUCH! IT SOLVED IT ALL:D:D:D:D – Emil Sunnerdahl Jan 14 '20 at 20:42

DCR · Accepted Answer · 2020-01-14T20:33:23.783

0

for(var i = 10; i>0 ;i--){
   for (var j=1;j<11;j++){
   
      var div = document.createElement("div"); 
      div.setAttribute("id", i + ',' + j);

      document.body.appendChild(div); 
      div.innerHTML= i + ',' + j;
   }
}

edited Jan 14 '20 at 20:33

answered Jan 14 '20 at 20:19

DCR

14,737
12
52
115

Creating multiple divs with decreasing numbering every tenth

2 Answers2