Shizumi/basic_jquery_10.html

## basic_jquery_10.html
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8" />
	<title>jQueryの練習</title>
	<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
<h1>jQueryの練習</h1>

<div id="main">
<p>これは練習です。こちらは、<a href="http://google.com/">リンク</a>です。</p>
<ul>
	<li>0番</li>
	<li class="listitem">1番</li>
	<li class="listitem">2番</li>
	<li><a href="http://yahoo.com/">3番</a></li>
</ul>
</div><!-- #main -->
<script>
$(function() {
	$('.listitem').click(function () {
		currentColor = $(this).css('color');  // 現在の色を取得
		console.log(currentColor);
		if (currentColor == 'rgb(0, 0, 0)') { // 'rgb(0, 0, 0)' = 黒の時
			currentColor = 'blue';
		} else {
			currentColor = 'black';
		}
		$(this).css('color', currentColor);
	});
});
</script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="ja">
	<head>
	<meta charset="utf-8" />
	<title>jQueryの練習</title>
	<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
	</head>
	<body>
	<h1>jQueryの練習</h1>

	<div id="main">
	<p>これは練習です。こちらは、<a href="http://google.com/">リンク</a>です。</p>
	<ul>
	<li>0番</li>
	<li class="listitem">1番</li>
	<li class="listitem">2番</li>
	<li><a href="http://yahoo.com/">3番</a></li>
	</ul>
	</div><!-- #main -->
	<script>
	$(function() {
	$('.listitem').click(function () {
	currentColor = $(this).css('color'); // 現在の色を取得
	console.log(currentColor);
	if (currentColor == 'rgb(0, 0, 0)') { // 'rgb(0, 0, 0)' = 黒の時
	currentColor = 'blue';
	} else {
	currentColor = 'black';
	}
	$(this).css('color', currentColor);
	});
	});
	</script>
	</body>
	</html>