rfay · September 27, 2015 17:45
diff --git a/index.html b/index.html
 <html>

 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <style>
        body {
            font-family: Verdana;
        }

        h1, h2, h3 {
            color: darkblue;
        }

        .rating-circle {
            height: 2em;
            width: 2em;
            border: .1em solid black;
            border-radius: 1.1em;
            display: inline-block;
            margin: 0;
            padding: .1em;
        }

        .rating-hover {
            background-color: yellow;
        }

        .rating-chosen {
            background-color: green;
        }
    </style>
 </head>

 <body>
 <h1>Contoso Web Developer Conference</h1>

 <h2>Finding elements using jQuery</h2>

 <div>This session is about identifying elements using jQuery methods and
    selectors.
 </div>
 <h3>Rate this session</h3>

 <div id="rating-container">
    <div class="rating-circle"></div>
    <div class="rating-circle"></div>
    <div class="rating-circle"></div>
    <div class="rating-circle"></div>
    <div class="rating-circle"></div>
 </div>

 <script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.min.js"></script>

 <script>
    $(function () {
        var justChosen = false;
        $(".rating-circle").hover(function () {
            if (!justChosen) {
                $('.rating-chosen').removeClass('rating-chosen');
                $(this).addClass('rating-hover');
                $(this).prevAll().addClass('rating-hover');
            }
        });
        $(".rating-circle").mouseout(function () {
            $('.rating-circle').removeClass('rating-hover');
        });
        $(".rating-circle").click(function () {
            $('.rating-chosen').removeClass('rating-chosen', 'rating-hover');
            $(this).addClass('rating-chosen');
            $(this).prevAll().addClass('rating-chosen');
            // Mark that they have clicked to prevent hover behaviors until mouseout of the region
            justChosen = true;
        });
        // If they have clicked something, we'll want to take no more hover action
        // until they mouseout of the whole container
        $("#rating-container").mouseout(function() {
            justChosen = false;
        });
    });

 </script>
 </body>

 </html>
diff --git a/Jquery Module 1 Lab.markdown b/Jquery Module 1 Lab.markdown
diff --git a/script.js b/script.js
 $(function() {
  $("#rating-container").css("color: blue");
  $(".rating-circle").hover(
    function() {
      $(this).class('.rating-hover');
      alert('hover');
    });
 });
	<html>

	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<style>
	body {
	font-family: Verdana;
	}

	h1, h2, h3 {
	color: darkblue;
	}

	.rating-circle {
	height: 2em;
	width: 2em;
	border: .1em solid black;
	border-radius: 1.1em;
	display: inline-block;
	margin: 0;
	padding: .1em;
	}

	.rating-hover {
	background-color: yellow;
	}

	.rating-chosen {
	background-color: green;
	}
	</style>
	</head>

	<body>
	<h1>Contoso Web Developer Conference</h1>

	<h2>Finding elements using jQuery</h2>

	<div>This session is about identifying elements using jQuery methods and
	selectors.
	</div>
	<h3>Rate this session</h3>

	<div id="rating-container">
	<div class="rating-circle"></div>
	<div class="rating-circle"></div>
	<div class="rating-circle"></div>
	<div class="rating-circle"></div>
	<div class="rating-circle"></div>
	</div>

	<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.min.js"></script>

	<script>
	$(function () {
	var justChosen = false;
	$(".rating-circle").hover(function () {
	if (!justChosen) {
	$('.rating-chosen').removeClass('rating-chosen');
	$(this).addClass('rating-hover');
	$(this).prevAll().addClass('rating-hover');
	}
	});
	$(".rating-circle").mouseout(function () {
	$('.rating-circle').removeClass('rating-hover');
	});
	$(".rating-circle").click(function () {
	$('.rating-chosen').removeClass('rating-chosen', 'rating-hover');
	$(this).addClass('rating-chosen');
	$(this).prevAll().addClass('rating-chosen');
	// Mark that they have clicked to prevent hover behaviors until mouseout of the region
	justChosen = true;
	});
	// If they have clicked something, we'll want to take no more hover action
	// until they mouseout of the whole container
	$("#rating-container").mouseout(function() {
	justChosen = false;
	});
	});

	</script>
	</body>

	</html>
	$(function() {
	$("#rating-container").css("color: blue");
	$(".rating-circle").hover(
	function() {
	$(this).class('.rating-hover');
	alert('hover');
	});
	});