Jquery-EventPart1

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title>Event part 1</title>
	<link rel="stylesheet" href="day.css" />
</head>
	<body>
		<h1>My Website</h1>
		<ul>
			<li>one</li>
			<li class="test">2</li>
			<li>3</li>
			<li>4</li>
			<li>5</li>
		</ul>
		<button data-file="day">Day</button>
		<button data-file="night">Night</button>
		<div class="attr"><a href="asad.com">Asad</a></div>
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js"></script>
		<script type="text/javascript">
			$(document).ready(function(){
				console.log('jquery ready');
				var link = $('link');//wap the selector better way
				$('button').click(function(){
					//console.log('Button was clicked');
					//console.log(this);// bortoman je function select kore hoyesi seita selet kore this method. $() diya wrap korte hoy.
					//console.log($(this));//use $ and wrap the 'this' on jquery.
					//$(this).text('changed');//


					//process 1
					//$('link').attr('href','night.css');Hard code bad code process 1

					//process 2
					/*
					var stylesheet = $(this).text().toLowerCase();//return function what we need to select
					console.log(stylesheet);//print the value or stylesheet
					$('link').attr('href',stylesheet + '.css');//return stylesheet value.css*/


					/*process 3 using HTML5 Data attributes
					var stylesheet = $(this).attr('data-file');
					console.log(stylesheet);
					$('link').attr('href',stylesheet + '.css');*/

					/*process 3 using jquery data() method
					var stylesheet = $(this).data('file');//data() method select the value which is associated in data attributes
					console.log(stylesheet);
					$('link').attr('href',stylesheet + '.css');*/


					/*Better way to wrap the selector and use it */
					var $this = $(this),
					stylesheet = $this.data('file');//data() method select the value which is associated in data attributes
					link.attr('href',stylesheet + '.css');
					$this
					.siblings('button')//select same buttons
					.removeAttr('disabled')// jodi button er attributes er modde konota disabled thakle seta remove koto
					.end()//uporer process ses koro
					.attr('disabled','disabled');//eta abar this object dara disabled kaj korbe.


				});
				/*$('.attr').click(function(){
					$('a').attr('href','http://asaduzzamansuman.com');
				});*/
				//$('li.test').siblings().css('color','red');select all except test classs
			});
		</script>
	</body>
</html>