Append td to tr in table with jQuery

Question

I learned at work a more comprehensive method than the one I was using before (see here). I find myself with the code below. I would like to add the last td (col2) to the parent tr and NOT the previous td (col1). How to proceed?

I looked everywhere, and I have not found an answer to my question ...

$('.main').append(
  $('<div>', {'class' : 'box'}).append(
    $('<div>', {'class' : 'table_responsive'}).append(
      $('<table>', {'class' : 'table'}).append(
        $('<tbody>').append(
          $('<tr>').append(
            $('<td>', {'class' : 'text-center', 'text' : 'col1'}).append(
            $('<td>', {'class' : 'text-center', 'text' : 'col2'})
            )
          )
        )
      )
    )
  )
);

Answer 1

You just need to move the .append() to follow the tr declaration, not the td:

$('<tr>')
    .append($('<td>', {'class' : 'text-center', 'text' : 'col1'}))
    .append($('<td>', {'class' : 'text-center', 'text' : 'col2'}))