CSS selector last visible child

by Plippie Plop

HTML

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li style="display:none;">Item 5</li>
<ul>

CSS

li.hide {
  display:none;
}

li:not(.hide):empty{color:red;}

li:not([style*="display:none"]):last-child{ color:red;}

.hideme {
    display:none;
}

.red {
    color: red;
}

JavaScript

$('li').not(':hidden').last().addClass("red");