sadet48 - jQuery JS Select Menu

Web Tutorials

<!DOCTYPE html>
<html>
<head>
<title>Web Tutorials</title>
<meta charset="utf-8">
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}
body {
	background: #fff;
	background: url(images/cicekler.jpg);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 100%;
	background-attachment: fixed;
}
nav {
	background: #fff;
	width: 100%;
	height: 45px;
}
nav ul li {
	background: #fff;
	text-align: center;
	list-style: none;
	padding: 10px;
	width: 120px;
	height: 25px;
	float: left;
}
nav ul li:hover {
	background: #0a0;
	text-align: center;
	list-style: none;
	width: 120px;
	height: 25px;
	float: left;
}
nav ul li.select {
	background: #0a0;
	text-align: center;
	list-style: none;
	width: 120px;
	height: 25px;
	float: left;
}
nav ul li a {
	font-family: Consolas;
	color: #444;
	font-size: 18px;
	background: transparent;
	text-decoration: none;
}
img {
	position: absolute;
	top: 50px;
	left: 15px;
}
footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 50px;
}
footer p {
	font-family: Consolas;
	color: #00B3D2;
	font-size: 18px;
	background: transparent;
	text-align: center;
}
</style>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.10.1.js"></script>
<script type="text/javascript">
        $("document").ready(function(e) {
        $("nav ul li").click(function(e) {
        $("nav ul li").removeClass('select');
        $(this).addClass('select');
    });
});
</script>
</head>
<body>
<nav>
	<ul>
		<li class="select"><a href="https://www.google.com.tr/webhp?ei=E12zVdqMMIL1UvC4g6gH&ved=0CAUQqS4oAw">Google</a></li>
		<li><a href="https://accounts.google.com/ServiceLogin?service=oz&passive=1209600&continue=https://plus.google.com/u/0/?gpsrc=gplp0#identifier">Google+</a></li>
		<li><a href="https://www.youtube.com/?gl=TR">Youtube</a></li>
		<li><a href="http://www.bedava-sitem.com/editpage.php#">Bedava-Sitem</a></li>
	</ul>
</nav>