Is it possible to add empty html rows dynamically?
I want to insert new html rows and clear their contents afterward.
To achieve this, I tried using the .html('')
method but faced some issues.
My implementation looks like the following code snippet:
How can I add rows and then clear their content successfully?
Thank you!
$(document).ready(function() {
$("table").on( "click", "tr", function() {
$("table").append($(this).clone().html(' '));
});
});
table {
border-collapse:collapse;}
td {
border:solid black 1px;
transition-duration:0.5s;
padding: 5px;
cursor:pointer;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tbody>
<tr>
<td>0</td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
</tbody>
</table>