php jquery

<?php ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
// session_start();
include '../db.php';
include '../nav.php';
?>
<div class="container-fluid">
<span><input type="text" id="number" placeholder="number">
<input type="text" id="desc" placeholder="desc">
<input type="button" class="add-row" value="Add Row"></span>
<div class="row">
<div class="col-sm-3">
<table class="table table-bordered table-sm">
<tbody class="mytables"></tbody>
</table>
</div>
<div class="col-sm-9"></div>
</div>
</div>
<script>
// here i like to display table side by side and addclass uniqe itemRow-number and .block-number
$(".add-row").click(function() {
var number = $("#number").val();
var desc = $("#desc").val();
var quantity = $("#number").val();
var j = 1;
for (var i = 0; i < quantity; i++) {
var markups = "<tr class='itemRow'><td class='block'>" + j + "</td><td>" + "1 X " + desc + "</td><td><a class='btn btn-xs btn-danger delete' href='#'>X</a></td></tr>";
$('.mytables').append(markups);
j++;
}
});

// here i like to delete specific itemRow-number and reorder .block-number
$('.mytables').on('click', '.delete', function(e) {
e.preventDefault();
if ($('.mytables tr').length > 0) {
$(this).closest('.itemRow').remove();
}
return false;
});
// $('.mytables .itemRow').addClass(function (i) {
// return 'itemRow-' + ++i
// })
</script>