how can i alternate row class after api data-CodePudding

I have tried everything i know and can't get an alterate tablerow class to work , without having all the rows duplicated or having a bunch of dummy rows inserted

Here is what i have

<script>
fetch("https://www63.myfantasyleague.com/2021/export?TYPE=league&L=43570&APIKEY=axVu38KXtfzuxwG4PV7BfDIeFA==&JSON=1").then(
  res => {
    res.json().then(
      data => {
        console.log(data.league.franchises.franchise);
        if (data.league.franchises.franchise.length > 0) {
          var temp = "";
          temp  = "<table id='league_emails'>";
          temp  = "<tbody>";
          temp  = "<tr><th>Franchise</th><th>Owner Name</th><th>Email</th></tr>";
          data.league.franchises.franchise.forEach((itemData) => {

            for (var i = 0; i < data.league.franchises.franchise.length; i  ) {
              if (i % 2)
                temp  = '<tr >';
              else
                temp  = '<tr >';

            }

            temp  = "<td>"   itemData.name   "</td>";
            temp  = "<td>"   itemData.owner_name   "</td>";
            temp  = "<td>"   itemData.email   "</td>";

          });
          temp  = "</tbody>";
          temp  = "</table>";
          document.getElementsByClassName('commish_league_safe')[0].innerHTML = temp;
        }
      }
    )
  }
)
</script>
<div ></div>

The issue lays here and i have tried a dozen things and wrapped it different ways

for (var i = 0; i < data.league.franchises.franchise.length; i  ) {
    if (i % 2)
        temp  = '<tr >';
    else
        temp  = '<tr >';

}

CodePudding user response：

<script>
fetch(https://www63.myfantasyleague.com/2021/export?TYPE=league&L=43570&JSON=1).then(
  res => {
    res.json().then(
      data => {
        console.log(data.league.franchises.franchise);
        if (data.league.franchises.franchise.length > 0) {
          var temp = "";
          temp  = "<table id='league_emails'>";
          temp  = "<tbody>";
          temp  = "<tr><th>Franchise</th><th>Owner Name</th><th>Email</th></tr>";
          data.league.franchises.franchise.forEach((itemData,i) => {

            /* for (var i = 0; i < data.league.franchises.franchise.length; i  ) { */
              if (i % 2)
                temp  = '<tr >';
              else
                temp  = '<tr >';

            /* } */

            temp  = "<td>"   itemData.name   "</td>";
            temp  = "<td>"   itemData.owner_name   "</td>";
            temp  = "<td>"   itemData.email   "</td>";
            temp  = "</tr>";

          });
          temp  = "</tbody>";
          temp  = "</table>";
          document.getElementsByClassName('commish_league_safe')[0].innerHTML = temp;
        }
      }
    )
  }
)
</script>
<div ></div>

Just before ending the loop close the tr tag. temp = "" itemData.email ""; after this line just add closing tag to append that to temp variable.