JS script which injects a stylesheet with prefixed CSS grid properties for Internet Explorer

inject-ie-grid.js

const ua = window.navigator.userAgent;
const isIE = /MSIE|Trident/.test(ua);
if (!isIE) return;

const styleElement = document.createElement("style");
styleElement.setAttribute("type", "text/css");

const grid = { rows: 2, cols: 4 };

let styleContent = `#grid {display: -ms-grid; -ms-grid-columns: (1fr)[${grid.cols}]; -ms-grid-rows: (1fr)[${grid.rows}];}`;

for (let row = 1; row <= grid.rows; row++) {
  for (let col = 1; col <= grid.cols; col++) {
    const cellNum = col + grid.cols * (row - 1);
    const cellStyle = `#grid .cell:nth-child(${cellNum}) {-ms-grid-row: ${row}; -ms-grid-column: ${col};}`;
    styleContent += cellStyle;
  }
}

styleElement.textContent = styleContent;
document.head.appendChild(styleElement);