How to store & retrieved values from HTML tables using jQuery in Database again in table format?

Question

I retrieved whole table values in one string variable using jQuery and send that variable data to another JSP page where I stored the whole data into the database but problem is that data was in table format and have many rows and columns and so that the whole data is storing in one column because I am unable to store that data in tabular format so whole data is storing in just one column. I want to store specific data in a tabular form not whole data inside one column. This is the JQuery Part

$(document).ready(function() {
  $('#btn_read_HTML_Table').click(function() {
    var html_table_data = "";
    var bRowStarted = true;
    
    $('#mytable tbody>tr').each(function() {
      $('td', this).each(function() {
        if (html_table_data.length == 0 || bRowStarted == true) {
          html_table_data += $(this).text();
          bRowStarted = false;
        } else
          html_table_data += " | " + $(this).text();
      });
      html_table_data += "\n";
      bRowStarted = true;
    });
    
    $.ajax({
      url: "load_details.jsp",
      type: 'POST',
      data: {
        details: html_table_data
      },
      success: function(data, textStatus, jqXHR) {
        console.log(data);
        
        // $("#loader").hide();
        // $("#post-container").show();
        $("#post-container").html(data);
        // $(temp).addClass('active')
      }
    })
  });
});