What's wrong with my code?

What's wrong with my code?

Hi
I try to follow this video
I want to create a clone of my image but no luck
Please look at my code:
  2. <html>
  3. <head>
  4.   

  6.   <script
  7.   src="http://code.jquery.com/jquery-3.3.1.min.js"
  8.   integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  9.   crossorigin="anonymous"></script>
  10. <style>
  11. .zoom{
  12. position:absolute;
  13. top:40px;
  14. }
  15. </style>
  16. </head>
  17. <body>
  18. <ul>
  19. <li><img src="rosa.jpg">
  20. <h2>Tshirt Rosa</h2>
  21. <button type="button">Comprar!</button>

  23. </li>
  24. <li><img src="branca.jpg">
  25. <h2>Tshirt Branca</h2>
  26. <button type="button">Comprar!</button>
  27. </li>
  28. <li><img src="azul.jpg">
  29. <h2>Tshirt Azul</h2>
  30. <button type="button">Comprar!</button>
  31. </li>
  32. </ul>
  33. <script>
  34. $("button").click(function() {
  35.   alert( "Handler for .click() called." );
  36. $(this).closest("li")
  37. .find("img")
  38. .clone()
  39. .addclass("zoom")
  40. .appendTo("body");
  41. setTimeout(function(){
  42. $(".zoom").remove();
  43. },1000);
  44. });

  46. </script>
  47. </body>
  48. </html>
What's wrong?
The message box shows but nothing happens
Thank you