DOM

Practicing With Events

Exercises


<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Practice</title>
</head>
<body>


	
	<div id="colorDiv">
		Click Me
	</div>
	
	<div id="toggleMe">
		Toggle Me
	</div>
	
	<div id="countMe">
	</div>
	
	<div>
		<input type="text" id="nameField">
	</div>
	
	<div id="greetingDiv">
		Hello, world
	</div>
</body>
</html>

1.) When someone clicks the #colorDiv change its background color to blue.

2.) When someone clicks the #toggleMe toggle the background color between white and red.

3.) When somone clicks the #countMe div display the number of times it has been clicked.

4.) Attach a click listener to #greetingDiv and grab the #nameField from the input tag. Use the #nameFieldto display Hello, with the entered name.