Customisable <li>'s in a list not working

Question

I'm trying to change one of the li elements to be red, another li element hyperlinked in a different colour with an underline rollover effect, and another li element hyperlinked in the standard colour but with an underline rollover effect that does not change the colour.

Any ideas what I'm doing wrong? Appreciate the help.

ul.standard-list{
	padding:0px 0 50px 00000;
	margin:0;
	text-align:left;
	color:#333;
	font-weight:100;
	font-family:verdana,arial,"Times New Roman", Times, serif,georgia,serif,helvetica;
	font-size:20px;
	-webkit-font-smoothing: antialiased; /* subtley makes fonts smoother */
	line-height:28px;
}
ul.standard-list a:link{
	color:#008CBA;
	text-decoration:none;
}
ul.standard-list a:visited{
	color:#008CBA;
	text-decoration:none;
}
ul.standard-list a:hover{
	color:#008CBA;
	text-decoration:underline;
}
ul.standard-list li{
	list-style-type: none;
	line-height:28px;
}
ul.standard-list li:before{
    /* Unicode bullet symbol */
    content: '\2022';
    /* Bullet color */
    color: #008CBA;
    padding-right: 10px;
}
.standard-list.no-list-decoration{
	color:red;
}
.standard-list.link-2 a:hover{
	text-decoration:underline;
}

<ul class="standard-list">
          <li><a href="http://google.co.uk">linked, underlined in different colour with underline rollover effect</a></li>
          <li class="no-list-decoration">red</li>
          <li class="link-2"><a href="http://google.co.uk">linked, underlined rollover effect but same colour as normal list style</a></li>
          <li>four</li>
          <li>five</li>
    </ul>

Answer 1

Define different classes to get different rollver effect behaviours for different li tags, underlined in different colour with underline rollover effect (.link-1) & underlined rollover effect but same colour as normal list style (.link-2) and style them respectively

ul.standard-list .link-1 a:hover{
    color:red;
    text-decoration:underline;
}
.standard-list .link-2 a:hover{
    text-decoration:underline;
}

ul.standard-list{
	padding:0px 0 50px 00000;
	margin:0;
	text-align:left;
	color:#333;
	font-weight:100;
	font-family:verdana,arial,"Times New Roman", Times, serif,georgia,serif,helvetica;
	font-size:20px;
	-webkit-font-smoothing: antialiased; /* subtley makes fonts smoother */
	line-height:28px;
}


ul.standard-list a:link{
	color:#008CBA;
	text-decoration:none;
}
ul.standard-list a:visited{
	color:#008CBA;
	text-decoration:none;
}
ul.standard-list .link-1 a:hover{
	color:red;
	text-decoration:underline;
}
ul.standard-list li{
	list-style-type: none;
	line-height:28px;
}
ul.standard-list li:before{
    /* Unicode bullet symbol */
    content: '\2022';
    /* Bullet color */
    color: #008CBA;
    padding-right: 10px;
}
.standard-list .no-list-decoration{
	color:red;
}
.standard-list .link-2 a:hover{
	text-decoration:underline;
}

<ul class="standard-list">
          <li class="link-1"><a href="http://google.co.uk">linked, underlined in different colour with underline rollover effect</a></li>
          <li class="no-list-decoration">red</li>
          <li class="link-2"><a href="http://google.co.uk">linked, underlined rollover effect but same colour as normal list style</a></li>
          <li>four</li>
          <li>five</li>
    </ul>

Answer 2

You are missing space in your css:

.standard-list.no-list-decoration{

change to

.standard-list .no-list-decoration{

or

ul.standard-list .no-list-decoration{

And the same with

.standard-list.link-2 a:hover{

change to

.standard-list .link-2 a:hover{

Answer 3

Red was not showing because you had no space between the 2 classes

ul.standard-list{
	padding:0px 0 50px 00000;
	margin:0;
	text-align:left;
	color:#333;
	font-weight:100;
	font-family:verdana,arial,"Times New Roman", Times, serif,georgia,serif,helvetica;
	font-size:20px;
	-webkit-font-smoothing: antialiased; /* subtley makes fonts smoother */
	line-height:28px;
}
ul.standard-list a:link{
	color:#008CBA;
	text-decoration:none;
}
ul.standard-list a:visited{
	color:#008CBA;
	text-decoration:none;
}
ul.standard-list a:hover{
	color:#008CBA;
	text-decoration:underline;
}
ul.standard-list li{
	list-style-type: none;
	line-height:28px;
}
ul.standard-list li:before{
    /* Unicode bullet symbol */
    content: '\2022';
    /* Bullet color */
    color: #008CBA;
    padding-right: 10px;
}
.standard-list .no-list-decoration{
	color:red;
}
.standard-list .link-2 a:hover{
	text-decoration:underline;
}

<ul class="standard-list">
          <li><a href="http://google.co.uk">linked, underlined in different colour with underline rollover effect</a></li>
          <li class="no-list-decoration">red</li>
          <li class="link-2"><a href="http://google.co.uk">linked, underlined rollover effect but same colour as normal list style</a></li>
          <li>four</li>
          <li>five</li>
    </ul>