Applying/removing last-child styling in a dynamic listing

Question

I have an unordered list with dynamic contents that can be shown/hidden, with all the li having border-bottom except the last child.

However, with jquery's .hide() applied to the last child, the element is just given display:none, therefore making the visually last element still showing its border-bottom.

What's the best way to solve this, that is also reusable across other similar ul within the project?

Please read **[`How to create a Minimal, Complete, and Verifiable example`](http://stackoverflow.com/help/mcve)** — Guruprasad J Rao, May 31 '16 at 03:51
[similar question](http://stackoverflow.com/questions/5275098/a-css-selector-to-get-last-visible-div), Please search before asking question. — user2970115, May 31 '16 at 03:56
@user2970115 my bad. did not find that one. thank you for linking. — threezerothree, May 31 '16 at 03:59

score 0 · Answer 1 · answered May 31 '16 at 03:57

0

If you want to remove border-bottom of last 'li' element, then use following CSS:-

.classname:last-child{
    border-bottom:0;
}

Where classname is the class added to the 'li' element.

.hide() will hide the last 'li' element, not border.

answered May 31 '16 at 03:57

Sabith

1,628
2
20
38

Applying/removing last-child styling in a dynamic listing

1 Answers1