While loop inside a for loop concatening











up vote
2
down vote

favorite












when I execute this code it spits out a new row inside the table but it includes the previous iteration along with the newest one. I want all "As" to be in the first row in the main table. And then I want all "Bs" to be in the second , etc, etc. Then for A0, A1, and A2, I want them to be in their own table within the first row, same for B0, B1 in the second row, etc, etc






<head>
<style>
table,
th,
td {
border: 1px solid black;
}
}
</style>
</head>

<table id="table">
<tr>
<td>gerp gerp</td>
<td>
<table id="0"></table>
</td>
</tr>
<tr>
<td>gerp gerp</td>
<td>
<table id="1"></table>
</td>
</tr>
<tr>
<td>gerp gerp</td>
<td>
<table id="2"></table>
</td>
</tr>
<tr>
<td>gerp gerp</td>
<td>
<table id="3"></table>
</td>
</tr>


</table>

<script>
var array = [
["A0---", "A1----", "A2---"],
["B0----", "B1---"],
["C0---", "C1---"],
["D0---", "D1---"]
];

var text = ""
console.log(array.length);
for (var i = 0; i < array.length; i++) {

var j = 0;
console.log(array[i].length);
while (j < array[i].length) {
text += "<tr><td>" + array[i][j] + "</td></tr>";
j++;
}

document.getElementById(i).innerHTML = text;
}
</script>












share|improve this question




























    up vote
    2
    down vote

    favorite












    when I execute this code it spits out a new row inside the table but it includes the previous iteration along with the newest one. I want all "As" to be in the first row in the main table. And then I want all "Bs" to be in the second , etc, etc. Then for A0, A1, and A2, I want them to be in their own table within the first row, same for B0, B1 in the second row, etc, etc






    <head>
    <style>
    table,
    th,
    td {
    border: 1px solid black;
    }
    }
    </style>
    </head>

    <table id="table">
    <tr>
    <td>gerp gerp</td>
    <td>
    <table id="0"></table>
    </td>
    </tr>
    <tr>
    <td>gerp gerp</td>
    <td>
    <table id="1"></table>
    </td>
    </tr>
    <tr>
    <td>gerp gerp</td>
    <td>
    <table id="2"></table>
    </td>
    </tr>
    <tr>
    <td>gerp gerp</td>
    <td>
    <table id="3"></table>
    </td>
    </tr>


    </table>

    <script>
    var array = [
    ["A0---", "A1----", "A2---"],
    ["B0----", "B1---"],
    ["C0---", "C1---"],
    ["D0---", "D1---"]
    ];

    var text = ""
    console.log(array.length);
    for (var i = 0; i < array.length; i++) {

    var j = 0;
    console.log(array[i].length);
    while (j < array[i].length) {
    text += "<tr><td>" + array[i][j] + "</td></tr>";
    j++;
    }

    document.getElementById(i).innerHTML = text;
    }
    </script>












    share|improve this question


























      up vote
      2
      down vote

      favorite









      up vote
      2
      down vote

      favorite











      when I execute this code it spits out a new row inside the table but it includes the previous iteration along with the newest one. I want all "As" to be in the first row in the main table. And then I want all "Bs" to be in the second , etc, etc. Then for A0, A1, and A2, I want them to be in their own table within the first row, same for B0, B1 in the second row, etc, etc






      <head>
      <style>
      table,
      th,
      td {
      border: 1px solid black;
      }
      }
      </style>
      </head>

      <table id="table">
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="0"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="1"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="2"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="3"></table>
      </td>
      </tr>


      </table>

      <script>
      var array = [
      ["A0---", "A1----", "A2---"],
      ["B0----", "B1---"],
      ["C0---", "C1---"],
      ["D0---", "D1---"]
      ];

      var text = ""
      console.log(array.length);
      for (var i = 0; i < array.length; i++) {

      var j = 0;
      console.log(array[i].length);
      while (j < array[i].length) {
      text += "<tr><td>" + array[i][j] + "</td></tr>";
      j++;
      }

      document.getElementById(i).innerHTML = text;
      }
      </script>












      share|improve this question















      when I execute this code it spits out a new row inside the table but it includes the previous iteration along with the newest one. I want all "As" to be in the first row in the main table. And then I want all "Bs" to be in the second , etc, etc. Then for A0, A1, and A2, I want them to be in their own table within the first row, same for B0, B1 in the second row, etc, etc






      <head>
      <style>
      table,
      th,
      td {
      border: 1px solid black;
      }
      }
      </style>
      </head>

      <table id="table">
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="0"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="1"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="2"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="3"></table>
      </td>
      </tr>


      </table>

      <script>
      var array = [
      ["A0---", "A1----", "A2---"],
      ["B0----", "B1---"],
      ["C0---", "C1---"],
      ["D0---", "D1---"]
      ];

      var text = ""
      console.log(array.length);
      for (var i = 0; i < array.length; i++) {

      var j = 0;
      console.log(array[i].length);
      while (j < array[i].length) {
      text += "<tr><td>" + array[i][j] + "</td></tr>";
      j++;
      }

      document.getElementById(i).innerHTML = text;
      }
      </script>








      <head>
      <style>
      table,
      th,
      td {
      border: 1px solid black;
      }
      }
      </style>
      </head>

      <table id="table">
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="0"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="1"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="2"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="3"></table>
      </td>
      </tr>


      </table>

      <script>
      var array = [
      ["A0---", "A1----", "A2---"],
      ["B0----", "B1---"],
      ["C0---", "C1---"],
      ["D0---", "D1---"]
      ];

      var text = ""
      console.log(array.length);
      for (var i = 0; i < array.length; i++) {

      var j = 0;
      console.log(array[i].length);
      while (j < array[i].length) {
      text += "<tr><td>" + array[i][j] + "</td></tr>";
      j++;
      }

      document.getElementById(i).innerHTML = text;
      }
      </script>





      <head>
      <style>
      table,
      th,
      td {
      border: 1px solid black;
      }
      }
      </style>
      </head>

      <table id="table">
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="0"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="1"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="2"></table>
      </td>
      </tr>
      <tr>
      <td>gerp gerp</td>
      <td>
      <table id="3"></table>
      </td>
      </tr>


      </table>

      <script>
      var array = [
      ["A0---", "A1----", "A2---"],
      ["B0----", "B1---"],
      ["C0---", "C1---"],
      ["D0---", "D1---"]
      ];

      var text = ""
      console.log(array.length);
      for (var i = 0; i < array.length; i++) {

      var j = 0;
      console.log(array[i].length);
      while (j < array[i].length) {
      text += "<tr><td>" + array[i][j] + "</td></tr>";
      j++;
      }

      document.getElementById(i).innerHTML = text;
      }
      </script>






      javascript for-loop while-loop






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 11 at 0:31

























      asked Nov 11 at 0:30









      nms553

      206




      206
























          2 Answers
          2






          active

          oldest

          votes

















          up vote
          1
          down vote



          accepted










          Initialize the text variable to the empty string inside the first loop instead:



          for (var i = 0; i < array.length; i++) {
          let text = '';


          But note that you can make your code more functional, shorter, and easier to read by using array methods like .map and forEach rather than using for, while, and manual iteration (better not to have to keep track of indicies):



          array.forEach((subArr, i) => {
          const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
          document.getElementById(i).innerHTML = text.join('');
          });





          var array = [
          ["A0---", "A1----", "A2---"],
          ["B0----", "B1---"],
          ["C0---", "C1---"],
          ["D0---", "D1---"]
          ];

          array.forEach((subArr, i) => {
          const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
          document.getElementById(i).innerHTML = text.join('');
          });

          table,
          th,
          td {
          border: 1px solid black;
          }

          <table id="table">
          <tr>
          <td>gerp gerp</td>
          <td>
          <table id="0"></table>
          </td>
          </tr>
          <tr>
          <td>gerp gerp</td>
          <td>
          <table id="1"></table>
          </td>
          </tr>
          <tr>
          <td>gerp gerp</td>
          <td>
          <table id="2"></table>
          </td>
          </tr>
          <tr>
          <td>gerp gerp</td>
          <td>
          <table id="3"></table>
          </td>
          </tr>


          </table>








          share|improve this answer




























            up vote
            1
            down vote













            Declare this variable var text = ""; inside of the for-loop






            var array = [  ["A0---", "A1----", "A2---"],  ["B0----", "B1---"],  ["C0---", "C1---"],  ["D0---", "D1---"]];

            for (var i = 0; i < array.length; i++) {
            var text = "";
            var j = 0;
            while (j < array[i].length) {
            text += "<tr><td>" + array[i][j] + "</td></tr>";
            j++;
            }

            document.getElementById(i).innerHTML = text;
            }

            table,th,td {  border: 1px solid black;}

            <table id="table">  <tr>    <td>gerp gerp</td>    <td>      <table id="0"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="1"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="2"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="3"></table>    </td>  </tr></table>








            share|improve this answer





















              Your Answer






              StackExchange.ifUsing("editor", function () {
              StackExchange.using("externalEditor", function () {
              StackExchange.using("snippets", function () {
              StackExchange.snippets.init();
              });
              });
              }, "code-snippets");

              StackExchange.ready(function() {
              var channelOptions = {
              tags: "".split(" "),
              id: "1"
              };
              initTagRenderer("".split(" "), "".split(" "), channelOptions);

              StackExchange.using("externalEditor", function() {
              // Have to fire editor after snippets, if snippets enabled
              if (StackExchange.settings.snippets.snippetsEnabled) {
              StackExchange.using("snippets", function() {
              createEditor();
              });
              }
              else {
              createEditor();
              }
              });

              function createEditor() {
              StackExchange.prepareEditor({
              heartbeatType: 'answer',
              convertImagesToLinks: true,
              noModals: true,
              showLowRepImageUploadWarning: true,
              reputationToPostImages: 10,
              bindNavPrevention: true,
              postfix: "",
              imageUploader: {
              brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
              contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
              allowUrls: true
              },
              onDemand: true,
              discardSelector: ".discard-answer"
              ,immediatelyShowMarkdownHelp:true
              });


              }
              });














               

              draft saved


              draft discarded


















              StackExchange.ready(
              function () {
              StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53244760%2fwhile-loop-inside-a-for-loop-concatening%23new-answer', 'question_page');
              }
              );

              Post as a guest















              Required, but never shown

























              2 Answers
              2






              active

              oldest

              votes








              2 Answers
              2






              active

              oldest

              votes









              active

              oldest

              votes






              active

              oldest

              votes








              up vote
              1
              down vote



              accepted










              Initialize the text variable to the empty string inside the first loop instead:



              for (var i = 0; i < array.length; i++) {
              let text = '';


              But note that you can make your code more functional, shorter, and easier to read by using array methods like .map and forEach rather than using for, while, and manual iteration (better not to have to keep track of indicies):



              array.forEach((subArr, i) => {
              const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
              document.getElementById(i).innerHTML = text.join('');
              });





              var array = [
              ["A0---", "A1----", "A2---"],
              ["B0----", "B1---"],
              ["C0---", "C1---"],
              ["D0---", "D1---"]
              ];

              array.forEach((subArr, i) => {
              const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
              document.getElementById(i).innerHTML = text.join('');
              });

              table,
              th,
              td {
              border: 1px solid black;
              }

              <table id="table">
              <tr>
              <td>gerp gerp</td>
              <td>
              <table id="0"></table>
              </td>
              </tr>
              <tr>
              <td>gerp gerp</td>
              <td>
              <table id="1"></table>
              </td>
              </tr>
              <tr>
              <td>gerp gerp</td>
              <td>
              <table id="2"></table>
              </td>
              </tr>
              <tr>
              <td>gerp gerp</td>
              <td>
              <table id="3"></table>
              </td>
              </tr>


              </table>








              share|improve this answer

























                up vote
                1
                down vote



                accepted










                Initialize the text variable to the empty string inside the first loop instead:



                for (var i = 0; i < array.length; i++) {
                let text = '';


                But note that you can make your code more functional, shorter, and easier to read by using array methods like .map and forEach rather than using for, while, and manual iteration (better not to have to keep track of indicies):



                array.forEach((subArr, i) => {
                const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                document.getElementById(i).innerHTML = text.join('');
                });





                var array = [
                ["A0---", "A1----", "A2---"],
                ["B0----", "B1---"],
                ["C0---", "C1---"],
                ["D0---", "D1---"]
                ];

                array.forEach((subArr, i) => {
                const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                document.getElementById(i).innerHTML = text.join('');
                });

                table,
                th,
                td {
                border: 1px solid black;
                }

                <table id="table">
                <tr>
                <td>gerp gerp</td>
                <td>
                <table id="0"></table>
                </td>
                </tr>
                <tr>
                <td>gerp gerp</td>
                <td>
                <table id="1"></table>
                </td>
                </tr>
                <tr>
                <td>gerp gerp</td>
                <td>
                <table id="2"></table>
                </td>
                </tr>
                <tr>
                <td>gerp gerp</td>
                <td>
                <table id="3"></table>
                </td>
                </tr>


                </table>








                share|improve this answer























                  up vote
                  1
                  down vote



                  accepted







                  up vote
                  1
                  down vote



                  accepted






                  Initialize the text variable to the empty string inside the first loop instead:



                  for (var i = 0; i < array.length; i++) {
                  let text = '';


                  But note that you can make your code more functional, shorter, and easier to read by using array methods like .map and forEach rather than using for, while, and manual iteration (better not to have to keep track of indicies):



                  array.forEach((subArr, i) => {
                  const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                  document.getElementById(i).innerHTML = text.join('');
                  });





                  var array = [
                  ["A0---", "A1----", "A2---"],
                  ["B0----", "B1---"],
                  ["C0---", "C1---"],
                  ["D0---", "D1---"]
                  ];

                  array.forEach((subArr, i) => {
                  const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                  document.getElementById(i).innerHTML = text.join('');
                  });

                  table,
                  th,
                  td {
                  border: 1px solid black;
                  }

                  <table id="table">
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="0"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="1"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="2"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="3"></table>
                  </td>
                  </tr>


                  </table>








                  share|improve this answer












                  Initialize the text variable to the empty string inside the first loop instead:



                  for (var i = 0; i < array.length; i++) {
                  let text = '';


                  But note that you can make your code more functional, shorter, and easier to read by using array methods like .map and forEach rather than using for, while, and manual iteration (better not to have to keep track of indicies):



                  array.forEach((subArr, i) => {
                  const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                  document.getElementById(i).innerHTML = text.join('');
                  });





                  var array = [
                  ["A0---", "A1----", "A2---"],
                  ["B0----", "B1---"],
                  ["C0---", "C1---"],
                  ["D0---", "D1---"]
                  ];

                  array.forEach((subArr, i) => {
                  const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                  document.getElementById(i).innerHTML = text.join('');
                  });

                  table,
                  th,
                  td {
                  border: 1px solid black;
                  }

                  <table id="table">
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="0"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="1"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="2"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="3"></table>
                  </td>
                  </tr>


                  </table>








                  var array = [
                  ["A0---", "A1----", "A2---"],
                  ["B0----", "B1---"],
                  ["C0---", "C1---"],
                  ["D0---", "D1---"]
                  ];

                  array.forEach((subArr, i) => {
                  const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                  document.getElementById(i).innerHTML = text.join('');
                  });

                  table,
                  th,
                  td {
                  border: 1px solid black;
                  }

                  <table id="table">
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="0"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="1"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="2"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="3"></table>
                  </td>
                  </tr>


                  </table>





                  var array = [
                  ["A0---", "A1----", "A2---"],
                  ["B0----", "B1---"],
                  ["C0---", "C1---"],
                  ["D0---", "D1---"]
                  ];

                  array.forEach((subArr, i) => {
                  const text = subArr.map(item => "<tr><td>" + item + "</td></tr>");
                  document.getElementById(i).innerHTML = text.join('');
                  });

                  table,
                  th,
                  td {
                  border: 1px solid black;
                  }

                  <table id="table">
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="0"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="1"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="2"></table>
                  </td>
                  </tr>
                  <tr>
                  <td>gerp gerp</td>
                  <td>
                  <table id="3"></table>
                  </td>
                  </tr>


                  </table>






                  share|improve this answer












                  share|improve this answer



                  share|improve this answer










                  answered Nov 11 at 0:35









                  CertainPerformance

                  66.2k143152




                  66.2k143152
























                      up vote
                      1
                      down vote













                      Declare this variable var text = ""; inside of the for-loop






                      var array = [  ["A0---", "A1----", "A2---"],  ["B0----", "B1---"],  ["C0---", "C1---"],  ["D0---", "D1---"]];

                      for (var i = 0; i < array.length; i++) {
                      var text = "";
                      var j = 0;
                      while (j < array[i].length) {
                      text += "<tr><td>" + array[i][j] + "</td></tr>";
                      j++;
                      }

                      document.getElementById(i).innerHTML = text;
                      }

                      table,th,td {  border: 1px solid black;}

                      <table id="table">  <tr>    <td>gerp gerp</td>    <td>      <table id="0"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="1"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="2"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="3"></table>    </td>  </tr></table>








                      share|improve this answer

























                        up vote
                        1
                        down vote













                        Declare this variable var text = ""; inside of the for-loop






                        var array = [  ["A0---", "A1----", "A2---"],  ["B0----", "B1---"],  ["C0---", "C1---"],  ["D0---", "D1---"]];

                        for (var i = 0; i < array.length; i++) {
                        var text = "";
                        var j = 0;
                        while (j < array[i].length) {
                        text += "<tr><td>" + array[i][j] + "</td></tr>";
                        j++;
                        }

                        document.getElementById(i).innerHTML = text;
                        }

                        table,th,td {  border: 1px solid black;}

                        <table id="table">  <tr>    <td>gerp gerp</td>    <td>      <table id="0"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="1"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="2"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="3"></table>    </td>  </tr></table>








                        share|improve this answer























                          up vote
                          1
                          down vote










                          up vote
                          1
                          down vote









                          Declare this variable var text = ""; inside of the for-loop






                          var array = [  ["A0---", "A1----", "A2---"],  ["B0----", "B1---"],  ["C0---", "C1---"],  ["D0---", "D1---"]];

                          for (var i = 0; i < array.length; i++) {
                          var text = "";
                          var j = 0;
                          while (j < array[i].length) {
                          text += "<tr><td>" + array[i][j] + "</td></tr>";
                          j++;
                          }

                          document.getElementById(i).innerHTML = text;
                          }

                          table,th,td {  border: 1px solid black;}

                          <table id="table">  <tr>    <td>gerp gerp</td>    <td>      <table id="0"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="1"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="2"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="3"></table>    </td>  </tr></table>








                          share|improve this answer












                          Declare this variable var text = ""; inside of the for-loop






                          var array = [  ["A0---", "A1----", "A2---"],  ["B0----", "B1---"],  ["C0---", "C1---"],  ["D0---", "D1---"]];

                          for (var i = 0; i < array.length; i++) {
                          var text = "";
                          var j = 0;
                          while (j < array[i].length) {
                          text += "<tr><td>" + array[i][j] + "</td></tr>";
                          j++;
                          }

                          document.getElementById(i).innerHTML = text;
                          }

                          table,th,td {  border: 1px solid black;}

                          <table id="table">  <tr>    <td>gerp gerp</td>    <td>      <table id="0"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="1"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="2"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="3"></table>    </td>  </tr></table>








                          var array = [  ["A0---", "A1----", "A2---"],  ["B0----", "B1---"],  ["C0---", "C1---"],  ["D0---", "D1---"]];

                          for (var i = 0; i < array.length; i++) {
                          var text = "";
                          var j = 0;
                          while (j < array[i].length) {
                          text += "<tr><td>" + array[i][j] + "</td></tr>";
                          j++;
                          }

                          document.getElementById(i).innerHTML = text;
                          }

                          table,th,td {  border: 1px solid black;}

                          <table id="table">  <tr>    <td>gerp gerp</td>    <td>      <table id="0"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="1"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="2"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="3"></table>    </td>  </tr></table>





                          var array = [  ["A0---", "A1----", "A2---"],  ["B0----", "B1---"],  ["C0---", "C1---"],  ["D0---", "D1---"]];

                          for (var i = 0; i < array.length; i++) {
                          var text = "";
                          var j = 0;
                          while (j < array[i].length) {
                          text += "<tr><td>" + array[i][j] + "</td></tr>";
                          j++;
                          }

                          document.getElementById(i).innerHTML = text;
                          }

                          table,th,td {  border: 1px solid black;}

                          <table id="table">  <tr>    <td>gerp gerp</td>    <td>      <table id="0"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="1"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="2"></table>    </td>  </tr>  <tr>    <td>gerp gerp</td>    <td>      <table id="3"></table>    </td>  </tr></table>






                          share|improve this answer












                          share|improve this answer



                          share|improve this answer










                          answered Nov 11 at 0:32









                          Ele

                          22.2k42044




                          22.2k42044






























                               

                              draft saved


                              draft discarded



















































                               


                              draft saved


                              draft discarded














                              StackExchange.ready(
                              function () {
                              StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53244760%2fwhile-loop-inside-a-for-loop-concatening%23new-answer', 'question_page');
                              }
                              );

                              Post as a guest















                              Required, but never shown





















































                              Required, but never shown














                              Required, but never shown












                              Required, but never shown







                              Required, but never shown

































                              Required, but never shown














                              Required, but never shown












                              Required, but never shown







                              Required, but never shown







                              Popular posts from this blog

                              Xamarin.iOS Cant Deploy on Iphone

                              Glorious Revolution

                              Dulmage-Mendelsohn matrix decomposition in Python