I have a div which which displays dynamically created tables (In a asp repeater actually). The no of tables can be different depending on the items it gets from the database. I have given a sample markup below with the css and the jquery code. Again the table will be dynamically created. I just have given two and did not include the mark inside it.

.todotable{border-bottom:1px solid white;}

<div id="divalert">
<table></table>
<table></table>
</div>

 $(document).ready(function () {
       $("#divalert").last().css("border-bottom", "none");
  });

My question is, how do I remove the border for the last table?

I have a div which which displays dynamically created tables (In a asp repeater actually). The no of tables can be different depending on the items it gets from the database. I have given a sample markup below with the css and the jquery code. Again the table will be dynamically created. I just have given two and did not include the mark inside it.

.todotable{border-bottom:1px solid white;}

<div id="divalert">
<table></table>
<table></table>
</div>

 $(document).ready(function () {
       $("#divalert").last().css("border-bottom", "none");
  });

My question is, how do I remove the border for the last table?

• javascript
• jquery
• asp
• css

2 Answers 2

You haven't selected the table. Try one of these:

$("#divalert :last-child").css("border-bottom", "none");

// or

$("#divalert table").last().css("border-bottom", "none");
$("#divalert table:last").css("border-bottom", "none"); // same as above

I'd rather use CSS for this. Using JS when CSS is available is never a good idea :-)

#divalert table:last-child {
    border-bottom: none;
}