Want to change the colour of the image when clicked and so that it remain changed after click

See more:

Javascript

CSS

HTML

Hi ,

I want to change the colour of the image after click , Basically all the images in the nav bar are background images set in css and I have another class with greater opacity (same as google plus nav bar )

My CSS are:

#vtab > ul > li.home {
background: url('images/home21.png') no-repeat center center;

}

#vtab > ul > li.selected {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);

border-right: none;
z-index: -1;

position: relative;
}
#vtab > ul > li:hover , #vtab > ul > li:active,#vtab > ul > li:focus,#vtab > ul > li:visited {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);

border-right: none;
z-index: -1;

position: relative;
}



HTML:

Home

Courses

• Explore

• Events

• Photos

• Communities

• Students