Can't change current link color

Good day. I want to change the current color of a link (opened link). I tried two ways how to do it.
First way

a:link {
color:black;
}
a:visited {
color:gray;
}
a:hover {
color:blue;
}
a:active {
color:purple;
}

It change color of all links to defined in a:visited . Hover and active work correct. I need change current link color and to remain this color while link is opened.
Second way

<div id="link1">
    some content
</div>
<div id="link2">
    some content
</div>

 <div class="div1">             
    <div id="navigation">
        <ul>
          <li><a data-tab="#link1" id="link-link1"href="#link1">Link1</a></li>
          <li><a data-tab="#link2" id="link-link2"href="#link2">Link2</a></li>
        </ul>
    </div>   
 </div>  

CSS code to change current link color:

#link1:target ~ .div1 #navigation #link-link1,
#link2:target ~ .div1 #navigation #link-link2
{
    background: #000;
    color: #fff;
}

This works but i need to define links before

<div id="link1">
    some content
</div>
<div id="link2">
    some content
</div>

And after it does not change the current color of the link. I tried

.div1 #navigation #link-link1 ~ #link1:target and .div1 #navigation #link-link1 #link1:target. 

Problem: there isn’t a previous sibling selector .

See if this helps: http://www.sitepoint.com/forums/showthread.php?842752-How-to-adjust-color-of-Active-Page-in-CSS&p=5091887

You might be use this example for more ideas,

a:active : when you click on the link and hold it
a:visited : when the link has already been visited

If you want to the link of current page to be highlighted, you can define particular style to the link,

.currentLink {
   color: #640200;
   background-color: #000000;
}

If you think:

.link1 {
   color: #640200;
   background-color: #000000;
}
.link2 {
   color: #640200;
   background-color: #000000;
}

It is not working. I tried this code:
CSS

a {color: #fff; font-size: 19px;	 padding-right:25px;	
 }     
a:link {color: #fff;			
 }     
a:visited {
 }     
 a:hover {	color: #000; 	 

}     
 a:active {	color: #000;
}     

.active {color:#000;}

JS

$(document).ready(function(){
   $("a.nav1").click(function () {
      // switch all tabs off
      $(".active").removeClass("active");
      // switch this tab on
      $(this).addClass("active");
   });
});

Link example
<li><a class=“nav1” data-tab=“#home” id=“link-home"href=”#home">Home</a></li>

This work but

padding-right:25px;
reorganize my slideshow. I need to use it with #navigation
#navigation a {color: #fff; font-size: 19px;	 padding-right:25px;	
 }     
#navigation a:link {color: #fff;			
 }     
#navigation a:visited {
 }     
#navigation a:hover {	color: #000; 	 

}     
#navigation a:active {	color: #000;
}     

.active {color:#000;}

But when i use #navigation JS script do not change color opened link to black. If i miss out

#navigation a

and use only

#navigation a link, ...  

default color of links is violet (no color defined in #navigation a:link ).