When populating the cells, append the cell value at the following conditions:

1. We are at the header row
2. We are at columns 1-6 (colIndex 0-5), or
3. We are at columns 7 or 8, given that column 6 has the value of “error”

Which we can select using this:

if( rowIndex == 0 || colIndex < 6 || (colIndex == 6 || colIndex == 7) && r[5].toLowerCase().trim() === "error") {
  row.append(cell);
}

Here’s a running demo (I’ve changed some parts of your code slightly):

data = [
  ['col1', 'col2', 'col3', 'col4', 'col5', 'col6', 'col7', 'col8'],
  ['jack', 'smith', '23', 'Y', 'Y', 'error', 'error_code', 'error_desc'],
  ['jack2', 'smith2', '232', 'Y2', 'Y2', 'no_error', 'error_code2', 'error_desc2']
];

function makeTable(container) {
  var table = $("<table/>");

  $.each(data, function(rowIndex, r) {
    var row = $("<tr/>");

    $.each(r, function(colIndex, c) {
      var cellMarkup = "<t" + (rowIndex == 0 ? "h" : "d") + "/>";
      var cell = $(cellMarkup);
      cell.text(c);

      if (colIndex == 5) {
        if (c.toLowerCase().trim() === "error") {
          cell.addClass("error blink");
        }
      }

      if (rowIndex == 0 || colIndex < 6 || (colIndex == 6 || colIndex == 7) && r[5].toLowerCase().trim() === "error") {
        row.append(cell);
      }
    });
    table.append(row);
  });

  return container.html(table);
}

makeTable($('.container'))

.error {
  color: red;
}
.blink {
  /* oh god no ;-) */
}

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

I have a table with the following elements. Jack Smith is an example row. I have multiple rows as such.

col1    col2   col3      col4   col5     col6       col7       col8
jack    smith  23        Y        Y      error  error_code error_desc

I am forming this table dynamically as shown below. My question is around col6, 7 and 8. There will be some rows that wouldn’t have col6 as error. I want col7 and col8 to be populated by error_code and error_desc only if col6 has an error. How can I achieve that? I am unsure of where to start from? Basically, I do not want to iterate over col7 and col8 if col6 does not have “error” value.

    var table = $("<table/>");
    $.each(data, function(rowIndex, r) {
        var row = $("<tr/>");
        $.each(r, function(colIndex, c) {           
            var cellMarkup = "<t"+(rowIndex == 0 ?  "h" : "d")+"/>";
            var cell = $(cellMarkup);
            cell.text(c);
            if(colIndex == 5){   --> I am doing this to flag an error in red. Nothing related to the posed question.
                if( $.trim(c.toLowerCase() ) === "error" ){
                    cell.addClass("error blink");
                }
        }  

            row.append(cell);               
        });
        table.append(row);                              
    });

    return container.html(table);


}