I'm currently working on adding CSS to a table that is generated dynamically when a button is clicked. The function that is triggered on the click event includes the following jQuery code to create the dynamic rows:
$("#employeDetail").append('<tr class="hide1" id="row'+empCurrentIndex+'">'
+'<td >'+employerName[empCurrentIndex]+'</td>'
+'<td >'+empMobileNo[empCurrentIndex]+'</td>'
+'<td >'+emplocation[empCurrentIndex]+'</td>'
+'<td >'+empTotNoMonth[empCurrentIndex]+'</td>'
+'<td><button class="btn" name="delete" value="Delete" onclick="return deleteEmpRow('+empCurrentIndex+');">Delete</button></td>'
+'<td><button class="btn" name="edit" value="Edit" onclick="return editEmpRow('+empCurrentIndex+');">Edit</button></td>'
+'</td></tr>').addClass('newRow');The button is within the table tag and triggers this JavaScript function to create the dynamic rows. I aim to add borders to these created rows. I attempted to achieve this by using the .addClass('newRow') method:
.newRow{
border:5px;
border-color:red;
}
However, the borders don't appear to be applied. Any assistance on this matter would be greatly appreciated.
Thank you