Style switcher

by Denes Kellner

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
	<body>
	
		<ul>
			<li><a href="#" data-value="1"> Style 1 </a></li>
			<li><a href="#" data-value="2"> Style 2 </a></li>
			<li><a href="#" data-value="3"> Style 3 </a></li>
			<li><a href="#" data-value="4"> Style 4 </a></li>
			<li><a href="#" data-value="5"> Style 5 </a></li>
		</ul>
		<div class="colorMe">
			<br><br><br>
		</div>
		
		<script>

			function styleSwitcher(x) {
			    var colors = ["blue","green","red","purple","orange"];
			    $(".colorMe").css("background-color",colors[--x]);
			}
		
		
			$("li > a").on("click",function() {
			    
			    var n = $(this).data("value");
			    styleSwitcher(n);
			
			});
			
		</script>
		
	</body>