JSFiddle - React, Tailwind, and code Playground

HTML

<div id="tgen"><body>

</body></div>

CSS

.eo_product_listing_table {}

.tableizer-table tr:nth-child(even) {
  background-color: #eee;
}

.tableizer-table {
  font-size: 12px;
  border: 1px solid #CCC;
  font-family: Arial, Helvetica, sans-serif;
  color: black;
}

.tableizer-table td {
  padding: 4px;
  margin: 3px;
  border: 2px solid #CCC;
  text-align: left;
  color: black;
}

.tableizer-table thead {
  font-weight: bold;
  text-align: left;
}

.tableizer-firstrow {
  background-color: white;
  border-collapse: separate;
  border-spacing: 5px;
  margin: 4px;
}

.tableizer-firstrow td {
  background-color: #104E8B;
  color: white !important;
  padding: 4px;
  margin: 4px;
}

JavaScript

var eo_cats = {
  para1: ["Item #"],
  para2: ["Type"],
  para3: ["Operating Temp"],
  para4: ['Dia'],
  para5: ['Length'],
  para6: ["Material"],
  para7: ["Junction"],
  para8: ["Price"],
  para9: ["order"]
};

var partnumpref = [
  ["NB4-CAXL-14U-12-"],
  ["A", "B", "C"], //dia
  ["A", "B", "C"], //len
  ["G", "U", "E"], //junction type
]


var paras1 = [
  ["K"],
  ["-270°C to 1372°C, –454°F to 2501°F"],
  ['1/8"', '3/16"', '1/4"'],
  ['6"', '12"', '18"'],
  ["316SS"],
  ["Grounded", "Ungrounded", "Exposed"],
  ["$51.00"],
  ["order"]
];

//for (q = 0; q < paras1.length; q++) {
//  console.log(paras1[q]);
//}

function arrayRecursion(paras) {
  if (paras.length == 1) {
 //   console.log(paras[0])
    return paras[0];
  }
  var results = [];
  var allValues = arrayRecursion(paras.slice(1));
  for (var i = 0; i < allValues.length; i++) {
    for (var j = 0; j < paras[0].length; j++) {
      results.push(paras[0][j] + "@" + allValues[i]);
    }
  }
  return results;
  
}

//console.log(arrayRecursion(paras1));

function arrayRecursion2(paras) {
  if (paras.length == 1) {
//    console.log(paras[0])
    return paras[0];
  }
  var results = [];
  var allValues = arrayRecursion2(paras.slice(1));
  for (var i = 0; i < allValues.length; i++) {
    for (var j = 0; j < paras[0].length; j++) {
      results.push(paras[0][j] + allValues[i]);
    }
  }
  return results;
}

var eopartnum = arrayRecursion2(partnumpref);

function generate_table(paras) {

var sep = [];
var res = [];
var singarrres = arrayRecursion(paras);
for (k = 0; k < singarrres.length; k++) {
  var str = singarrres[k];
  var res = str.split("@");
  sep.push(res);
}
//console.log(sep);


  // get the reference for the body
  var body = document.getElementsByTagName("body")[0];

  // creates a <table> <thead> <tbody> elements
  var tbl = document.createElement("table");
  var tblHead = document.createElement("thead");
  var tblBody = document.createElement("tbody");
  tblBody.className =...