goldenapples/calc.html

## calc.html
<html>
	<head>
	</head>
	<body>
		<form>
			<p>
				<label for="earnings">Earnings</label>
				<input type="number" id="earnings" />
			</p>
			<p>
				<label for="expanses">Expenses</label>
				<input type="number" id="expenses" />
			</p>
			<p>
				<label for="hours">Hours Worked</label>
				<input type="number" id="hours" />
			</p>
			<p>
				<label for="commute">Commute and other time</label>
				<input type="number" id = "commute" />
			</p>
		</form>
		<p>Actual earnings / hour for this job: $<b id="result"></b></p>
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
		<script type="text/javascript">
			calculate = function( earnings, expenses, hours, commute ) {
				return ( earnings - expenses ) / ( hours + commute );
			}
			$('input').on('change', function() {
				var earnings, expenses, hours, commute;
				earnings = $('#earnings').val();
				expenses = $('#expenses').val();
				hours = $('#hours').val();
				commute = $('#commute').val();

				$('#result').text( calculate( earnings, expenses, hours, commute ) );
			});

		</script>
	</body>
</html>
	<html>
	<head>
	</head>
	<body>
	<form>
	<p>
	<label for="earnings">Earnings</label>
	<input type="number" id="earnings" />
	</p>
	<p>
	<label for="expanses">Expenses</label>
	<input type="number" id="expenses" />
	</p>
	<p>
	<label for="hours">Hours Worked</label>
	<input type="number" id="hours" />
	</p>
	<p>
	<label for="commute">Commute and other time</label>
	<input type="number" id = "commute" />
	</p>
	</form>
	<p>Actual earnings / hour for this job: $<b id="result"></b></p>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script type="text/javascript">
	calculate = function( earnings, expenses, hours, commute ) {
	return ( earnings - expenses ) / ( hours + commute );
	}
	$('input').on('change', function() {
	var earnings, expenses, hours, commute;
	earnings = $('#earnings').val();
	expenses = $('#expenses').val();
	hours = $('#hours').val();
	commute = $('#commute').val();

	$('#result').text( calculate( earnings, expenses, hours, commute ) );
	});

	</script>
	</body>
	</html>