Each set of exercises is paired
with a chapter of the book.

A Smarter Way to Learn jQuery

A Smarter Way to Learn jQuery Practice Exercises

Click to select a chapter to practice.

  1. Target and action
  2. Add a class
  3. Select by class
  4. Select by id
  5. Read what the user has entered
  6. Fill in a form field for the user
  7. Setting versus getting content
  8. Fade in and out
  9. Watch for a click
  10. Do something when there's a click
  11. Slide something into view
  12. Show and toggle
  13. Change styling inline
  14. this
  15. Select multiple elements
  16. An alternative for selecting multiple elements
  17. Replace an id
  18. Remove things
  19. Toggle a class
  20. Replace things
  21. Another way to replace
  22. Variables in jQuery
  23. Variable names legal and illegal
  24. Personalize a heading
  25. Add HTML to existing text
  26. Chaining
  27. Adding jQuery to your page
  28. document.ready
  29. Add something at the end
  30. Add something at the beginning
  31. Insert something after something else
  32. Insert something before something else
  33. More about changing attributes
  34. Remove an attribute
  35. Dealing with id and class attributes
  36. Changing attributes: two more examples
  37. Make a "Show more" feature
  38. Animate an expansion
  39. Fly something in from the side
  40. Fly it to the center
  41. Animate two moves at once
  42. Let jQuery measure the picture
  43. Measure exactly what you want
  44. Fly something by changing its margin
  45. Delay
  46. Stop a slide or animation
  47. Swap images using toggle()
  48. Change opacity
  49. Give something a chance to finish
  50. Make animated tabs Part 1
  51. Make animated tabs Part 2
  52. Make animated tabs Part 3
  53. Make animated tabs Part 4
  54. Size divs to fit the window
  55. Scroll to the next panel
  56. Animate the scroll
  57. Monitor the scroll position
  58. Make something happen when the user scrolls
  59. Select by even or odd
  60. Select by first or last
  61. Select by next
  62. The DOM
  63. The DOM: Parents and children
  64. Select the first child or last child
  65. Select the first or last child of a type
  66. Select the nth child or the nth child of a type
  67. Select the parents
  68. Select the siblings
  69. Filter
  70. Not
  71. Highlight the active text field
  72. each
  73. Get information about an event
  74. Select elements that contain a particular string
  75. Select elements that have a certain element within them
  76. Select elements by attribute value
  77. Select elements by attribute value fragment
  78. Delegate