dheeraj-thedev · April 11, 2021 02:00 · Apr 19, 2016 · Apr 19, 2016 · Apr 19, 2016 · Apr 19, 2016
diff --git a/jquery-exercises.md b/jquery-exercises.md
@@ -71,4 +71,21 @@ HTML
 
 **Instructions:**
 
-Add jQuery code that slides up the paragraphs that start with the words "I am a hidden secret".
+Add jQuery code to modify the page so that when the user clicks the button, the paragraphs that start with the words "I am a hidden secret" slide up.
+
+## Exercise 4
+
+```html
+<img src="http://hackasaurus.toolness.org/images/goggles/supergirl.png">
+<p>
+  <button id="clicker">Click me to change the picture</button>
+</p>
+```
+
+**Instructions:**
+
+Change the page with jQuery so that when the button is clicked, the image changes to this:
+
+<img src="http://rs284.pbsrc.com/albums/ll36/Bigsteve87/Gifs/Liz_Lemon_High_Five.gif~c200">
+
+**Hint:** Change the `src` [attribute](http://api.jquery.com/attr/) of the image.
diff --git a/jquery-exercises.md b/jquery-exercises.md
@@ -49,6 +49,8 @@ function say(text) {
 }
 ```
 
+**Instructions:**
+
 Add jQuery that greets the user by calling the
 above `say` function whenever the user clicks
 the "Greet me!" button, taking into account the [value](http://api.jquery.com/val/) of the text field.

diff --git a/jquery-exercises.md b/jquery-exercises.md
@@ -51,7 +51,9 @@ function say(text) {
 
 Add jQuery that greets the user by calling the
 above `say` function whenever the user clicks
-the "Greet me!" button.
+the "Greet me!" button, taking into account the [value](http://api.jquery.com/val/) of the text field.
+
+For example, if the user types the word "Bob" into the text field, then the computer should say "Hello Bob!" when the button is clicked.
 
 ## Exercise 3
 

diff --git a/jquery-exercises.md b/jquery-exercises.md
@@ -23,7 +23,7 @@ HTML
 
 **Instructions:**
 
-1. Add jQuery code that [fades in](http://api.jquery.com/fadein/) the text "I am a hidden secret" whenever the button is clicked.
+1. Add jQuery code that [fades in](http://api.jquery.com/fadein/) the text "I am a hidden secret" whenever the button is [clicked](https://api.jquery.com/click/).
 2. Change your jQuery code so it [slides down](http://api.jquery.com/slidedown/) the text instead of fading it in.
 3. Change the button text to say "Click me to toggle a hidden secret!" and make the text [toggle between fading in and out](http://api.jquery.com/fadetoggle/) each time it is clicked.
 

diff --git a/jquery-exercises.md b/jquery-exercises.md
@@ -52,3 +52,19 @@ function say(text) {
 Add jQuery that greets the user by calling the
 above `say` function whenever the user clicks
 the "Greet me!" button.
+
+## Exercise 3
+
+HTML
+
+```html
+<button id="clicker">Click me to hide the hidden secrets!</button>
+<p class="secret">I am hidden secret #1.</p>
+<p class="secret">I am hidden secret #2.</p>
+<p class="secret">I am hidden secret #2.</p>
+<p>I am <em>not</em> a hidden secret.</p>
+```
+
+**Instructions:**
+
+Add jQuery code that slides up the paragraphs that start with the words "I am a hidden secret".
diff --git a/jquery-exercises.md b/jquery-exercises.md
@@ -17,11 +17,15 @@ Then paste in the proper HTML and JS in the panes and follow the exercise instru
 HTML
 
 ```html
-<div id="clicker">Click me to show a hidden secret!</div>
+<button id="clicker">Click me to show a hidden secret!</button>
 <div id="secret" style="display: none">I am a hidden secret.</div>
 ```
 
-**Instructions:** Add jQuery code that fades in the text "I am a hidden secret" whenever "Click me to show a hidden secret" is clicked.
+**Instructions:**
+
+1. Add jQuery code that [fades in](http://api.jquery.com/fadein/) the text "I am a hidden secret" whenever the button is clicked.
+2. Change your jQuery code so it [slides down](http://api.jquery.com/slidedown/) the text instead of fading it in.
+3. Change the button text to say "Click me to toggle a hidden secret!" and make the text [toggle between fading in and out](http://api.jquery.com/fadetoggle/) each time it is clicked.
 
 ## Exercise 2
 

diff --git a/jquery-exercises.md b/jquery-exercises.md
@@ -0,0 +1,50 @@
+Here are some mini exercises to challenge your jQuery skills a bit.
+
+## Instructions
+
+Create a new page on [jsbin.com](http://jsbin.com/) and add the following script tag to it:
+
+```html
+<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
+```
+
+(Alternatively, you can use the "Add Library" menu and choose any version of jQuery.)
+
+Then paste in the proper HTML and JS in the panes and follow the exercise instructions.
+
+## Exercise 1
+
+HTML
+
+```html
+<div id="clicker">Click me to show a hidden secret!</div>
+<div id="secret" style="display: none">I am a hidden secret.</div>
+```
+
+**Instructions:** Add jQuery code that fades in the text "I am a hidden secret" whenever "Click me to show a hidden secret" is clicked.
+
+## Exercise 2
+
+HTML
+
+```html
+<span>Enter your name:</span>
+<input type="text" id="name">
+<button id="greet">Greet me!</button>
+```
+
+JavaScript
+
+```js
+// Call say("Hi!") to have your computer say hi!
+// This only works on recent versions of Safari
+// and Chrome at the moment.
+function say(text) {
+  var msg = new SpeechSynthesisUtterance(text);
+  window.speechSynthesis.speak(msg);  
+}
+```
+
+Add jQuery that greets the user by calling the
+above `say` function whenever the user clicks
+the "Greet me!" button.