Add new row in html dynamically using jQuery

Question

I need to create one HTML table using JSON data. need to add one button on each row .. (add row).

add_row button functionality

need to copy the content of the above row and create a new row below that row.

also, the button can add multiple rows at a time

I think this is a little challenging task; please help me.

Answer 1

Not really sure what you are after sorry, but the following might help you out.

$(document).ready(function () {
   $('#my_button').click( function (e) {
      var dynamic_html = "<tr>whatever data you want (including raw html) </tr>";
        jQuery('#my_table').append(dynamic_html);
   });
}

Inside the "dynamic_html" you can put any text/html that you want. You can add in your table cells and the button that you are talking about. When being appended it html tags will be read as html and add to your page.