CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Panos Angelopoulos
Panos Angelopoulos

Reputation: 609

New javascript HTML element doesn't follows css rule

I have an issue when i'm trying to add rows in a table using Javascript and jQuery.

My code:

<script>
$(document).ready(function(){
   for (i=0; i<myvar.length; i++){
      $("#items").after('<tr class="item-row"><td class="item-name"></td></tr>');
    }
});
</script>

My problem is that the new row did not take the style of my CSS file. CSS file loaded in <head>.

Did i miss something?

Upvotes: 0

Views: 53

Answers (1)

Dhara Parmar
Dhara Parmar

Reputation: 8101

Use .append instead of .after because .after is adding tr outside of the table that's why the CSS is not applying:

for (i=0; i<5; i++){
      $("#items").append('<tr class="item-row"><td class="item-name"></td></tr>');
}

Upvotes: 1

Related Questions