---
tags: 軟體工程師體驗營 - 2023
---

# 🏅 切版任務 Day12 - jQuery 點選按鈕動態切換 active 效果

## 題目
複製此 [Codepen](https://codepen.io/hexschool/pen/mdzWvwB) 模板，練習運用 jQuery
當點擊按鈕時，使按鈕切換成 `.active` 樣式。（只需撰寫 JS 區塊）

大致效果：


## 回報流程

1. 將答案貼在 Codepen 並複製 Codepen 連結貼至「回報區」回報
（也可以將答案直接貼至「回報區」）


<!--

解答：
https://codepen.io/hexschool/pen/YzJZBqN

-->

回報區
---

| 報數 | Discord 名字 | Codepen／其他回饋 |
|:----:|:--------------------:|:---------------------------------------------------------------------------:|
| 1 | Rochel#4754 | [Codepen](https://codepen.io/rochelwang1205/pen/vYVrNzb) |
| 2 | Berlin#7338 | [Codepen](https://codepen.io/3qberlin/pen/wvYXKLK) |
| 3 | Kulimusoda#2785 | [Codepen](https://codepen.io/yuch3n_chen/pen/YzJvyBB) |
| 4 | Izumi 泉#9691 | [Codepen](https://codepen.io/kouta-f2e/pen/wvYXMwM) |
| 5 | Eero#1147 | [Codepen](https://codepen.io/Eero-Chiao/pen/rNqKxed) |
| 6 | Ann Chou#0146 | [Codepen](https://codepen.io/annchou_illu/pen/qBJKOgy) |
| 7 | 不要迷戀媽的奶 #0295 | [Codepen](https://codepen.io/kewdjbwp-the-typescripter/pen/RweJrab) |
| 8 | Jennifer Chuang#3937 | [Codepen](https://codepen.io/yujhen/pen/ZEqRQLr) |
| 9 | 史滴芬#4310 | [Codepen](https://codepen.io/steven870107/pen/KKGeVqX) |
| 10 | DeLi#8324 | [Codepen](https://codepen.io/delichaomoon/pen/qBJKbxG) |
| 11 | Jacky7035#9423 | [Codepen](https://codepen.io/adens123/pen/WNayrzE) |
| 12 | Ataraxia#9977 | [Codepen](https://codepen.io/ataraxia8888/pen/abRwXvX) |
| 13 | snow#0255 | [Codepen](https://codepen.io/snow21723/pen/jOeKWeZ) |
| 14 | SKey#9905 | [Codepen](https://codepen.io/Dale-Chien/pen/PoyaZeG) |
| 15 | vvay#4113 | [Codepen](https://codepen.io/pellmssx-the-sasster/pen/wvYXMOq) |
| 16 | Celia#1715 | [Codepen](https://codepen.io/drdrvpgf-the-bashful/pen/mdzKVaE) |
| 17 | judy123#2363 | [Codepen](https://codepen.io/hsuantsong/pen/OJBENJj) |
| 18 | 黑白兔#0684 | [Codepen](https://codepen.io/johnny329/pen/RweJrXG) |
| 19 | Snadra#1987 | [Codepen](https://codepen.io/mlqmhltg/pen/JjmZXEY) |
| 20 | peihsuan#6315 | [Codepen](https://codepen.io/peihsuanlai/pen/qBJKZNO) |
| 21 | jia yu#8896 | [Codepen](https://codepen.io/fjqxaznl-the-reactor/pen/jOeKWmL) |
| 22 | Quantum#6093 | [Codepen](https://codepen.io/Min-Hao-Hung/pen/MWPXyeL) |
| 23 | しあわせね#0036 | [Codepen](https://codepen.io/Front-end-engineer/pen/poxKyVB) |
| 24 | 銀光菇#1692 | [Codepen](https://codepen.io/genesynthesis/pen/KKGezzG) |
| 25 | 辣椒#1002 | [Codepen](https://codepen.io/chilichen118/pen/WNaywWm) |
| 26 | bonnieli1414#4906 | [Codepen](https://codepen.io/bonnieli1414/pen/LYgrNKL?editors=1111) |
| 27 | Daisy_li#4231 | [Codepen](https://codepen.io/lidairong-gmail-com/pen/rNqKLNe) |
| 28 | 汪汪#4486 | [Codepen](https://codepen.io/hunwooooof/pen/BaqVzBv) |
| 29 | 雲漢#5319 | [codepen](https://codepen.io/keon981/pen/rNqKLOL) |
| 30 | 冬天#5215 | [Codepen](https://codepen.io/winter_/pen/zYmaBNZ) |
| 31 | JimWang#6134 | [Codepen](https://codepen.io/Jim-Wang-the-selector/pen/rNqKLzj) |
| 32 | gahwa#3562 | [Codepen](https://codepen.io/gahwa17/pen/bGmKePE) |
| 33 | Akira#9996 | [Codepen](https://codepen.io/Akira-Chen/pen/jOeKMOy) |
| 34 | Eden.C#9359 | [codepen](https://codepen.io/iseden/pen/OJBEXGJ) |
| 35 | Hao#2485 | [codepen](https://codepen.io/Seanfeb16/pen/WNayGex) |
| 36 | Uli#1946 | [codepen](https://codepen.io/uli1313/pen/LYgrZwg) |
| 37 | 翔.#0859 | [codepen](https://codepen.io/energy95272z/pen/PoyaGjN) |
| 38 | ChaosTu#9311 | [codepen](https://codepen.io/torotu/pen/XWxYjYy) |
| 39 | K（アギルダー）#0386 | [codepen](https://codepen.io/klay376014/pen/JjmZReQ) |
| 40 | jelly77#2088 | [codepen](https://codepen.io/Ming-chiang/pen/WNayoNz) |
| 41 | Lychee KK | [Codepen](https://codepen.io/kakakala/pen/OJBERLP) |
| 42 | 肉個阿倫#7172 | [Codepen](https://codepen.io/i9574385/pen/jOeKVPK) |
| 43 | Rayo#8002 | [Codepen](https://codepen.io/loborayo/pen/vYVrygx) |
| 44 | ray0304#2070 | [Codepen](https://codepen.io/Ray0304/pen/jOeKBEy) |
| 45 | Kaya#8857 | [Codepen](https://codepen.io/laron9486/pen/zYmaZKa) |
| 46 | 姜承#8204 | [Codepen](https://codepen.io/Troy0718/pen/jOeKmrp) |
| 47 | jimhop#6510 | [Codepen](https://codepen.io/jimsansssss/pen/gOBKWMR) |
| 48 | jackwu#4437 | [Codepen](https://codepen.io/jackwu1588003/pen/XWxYgPa) |
| 49 | 司機叔叔#2463 | [Codepen](https://codepen.io/bigv5566/pen/vYVrZVv) |
| 50 | Döng#2328 | [Codepen](https://codepen.io/htamlkdz-the-encoder/pen/mdzKMOd) |
| 51 | Evaxof#1266 | [Codepen](https://codepen.io/evaxof/pen/YzJvrrZ) |
| 52 | N0c7iluc3n7#4390 | [Codepen](https://codepen.io/huang-yu-cheng/pen/OJBExKo/) |
| 53 | PayRoom#8328 | [CodePen](https://codepen.io/water38198/pen/bGmKYeJ) |
| 54 | 吳偉雄恩#2256 | [Codepen](https://codepen.io/Bamboo1212/pen/GRYGONY) |
| 55 | Yuu#5361 | [Codepen](https://codepen.io/alycehwy/pen/RweJjvd) |
| 56 | alexmav04#5048 | [Codepen](https://codepen.io/alexmav04/pen/NWOzwVG) |
| 57 | andrew0404#4576 | [Codepen](https://codepen.io/Loonng/pen/jOeKZOx) |
| 58 | PoWei#8484 | [Codepen](https://codepen.io/harrison-wei-lai/pen/GRYGxJG) |
| 59 | 肉魚#2149 | [Codepen](https://codepen.io/zoechen13/pen/XWxYExg) |
| 60 | wiimax#4564 | [Codepen](https://codepen.io/willismax/pen/oNayMrP) |
| 61 | Zhong#8917 | [Codepen](https://codepen.io/klfjrlod-the-sasster/pen/OJBEoGW?editors=1111) |
| 62 | yoyo#1003 | [Codepen](https://codepen.io/pen/vYVrVYG) |
| 63 | alll6z#9204 | [Codepen](https://codepen.io/A6Z/pen/MWPXzQy) |
| 64 | 兔子#6746 | [Codepen](https://codepen.io/CarrotDetector/pen/oNaywNe) |
| 65 | 長方形#9612 | [Codepen](https://codepen.io/imjjw/pen/wvYXRZd) |
| 66 | Tina02#2691 | [codepen](https://codepen.io/riifwerr-the-selector/pen/WNayReW) |
| 67 | 陳庭#3529 | [codepen](https://codepen.io/yuting850309/pen/jOeKJaO) |
| 68 | ABOOS#6276 | [codepen](https://codepen.io/guhungyin/pen/mdzKgNE) |
| 69 | liam9930#4129 | [codepen](https://codepen.io/jgnjfvvt-the-lessful/pen/vYVrqBW) |
| 70 | duck#3310 | [codepen](https://codepen.io/papy0715/pen/vYVrPRz) |
| 71 | HsuanTang#1349 | [codepen](https://codepen.io/HsuanTang/pen/LYgrKmQ) |
| 72 | Judy☻#7874 | [Codpen](https://codepen.io/hsiaohan/pen/WNayqEV?editors=1111) |
| 73 | Janet#5784 | [Codpen](https://codepen.io/janetlinnn/pen/qBJKzvo) |
| 74 | MitA#7407 | [Codpen](https://codepen.io/qaz15996398/pen/WNayVVZ) |
| 75 | 泊岸#3466 | [Codpen](https://codepen.io/qoq77416416/pen/yLRqLPY) |
| 76 | Bruce-Lee#0629 | [Codpen](https://codepen.io/xxhdklwi-the-decoder/pen/oNaMXmY?editors=0110) |
| 77 | 一瑋#8459 | [CodePen](https://codepen.io/zerosula/pen/xxyzOEr) |
| 78 | David0799#4415 | [CodePen](https://codepen.io/David0799/pen/XWxBbwJ) |
| 79 | 冷曄#9378 | [CodePen](https://codepen.io/HgHale/pen/LYgBGbg) |
| 80 | charlottelee849#0366 | [CodePen](https://codepen.io/char849/pen/oNaMLgW) |
| 81 | cJerry456789#9029 | [CodePen](https://codepen.io/aria198a/pen/YzJjpBV) |
| 82 | jun777#2468 | [CodePen](https://codepen.io/js18151102/pen/mdzjRyp) |
| 83 | 變羊魔法#6372 | [Codepen](https://codepen.io/cssf998811/pen/xxyJggg) |
| 84 | Lainie#1931 | [Codepen](https://codepen.io/Lainie88/pen/bGmjaEN) |
| 85 | chichi#1534 | [Codepen](https://codepen.io/chichihuang/pen/jOepaxN) |
| 86 | satarkuo#5736 | [Codepen](https://codepen.io/SatarKuo/pen/ZEqjRvV) |
| 87 | YHT#1696 | [Codepen](https://codepen.io/YHT31/pen/RweBjgM) |
| 88 | Maxine#9061 | [Codepen](https://codepen.io/Maxine_Liao/pen/VwEBNQR) |
| 89 | henrykgb#5749 | [Codepen](https://codepen.io/henrymorgan666/pen/QWZBXMP) |
| 90 | 鉦勝#8333 | [Codepen](https://codepen.io/atckmax823/pen/bGmxpyv) |
| 91 | RyanC893412#4835 | [Codepen](https://codepen.io/mcdbfwcb-the-sans/pen/Exdeyoy) |
| 92 | penny#6214 | [Codepen](https://codepen.io/penny8989/pen/VwEGjyM) |
| 93 | Aritan#1931 | [Codepen](https://codepen.io/Aritan/pen/eYPLdXV) |
| 94 | Yvonne#2721 | [Codepen](https://codepen.io/Evonne/pen/mdzGrYd?editors=1111) |
| 95 | townyuan#2653 | [Codepen](https://codepen.io/townyuan/pen/zYmJNBx) |
| 96 | Hanana#9025 | [Codepen](https://codepen.io/hananalin/pen/RweYgLx) |
| 97 | 依依#6306 | [Codepen](https://codepen.io/Rita-Yang/pen/RweYmeR) |
| 98 | andychiou#4830 | [Codepen](https://codepen.io/andychiou1113/pen/VwEGoLX) |
| 99 | 鄭舜仁#6606 | [Codepen](https://codepen.io/randomno/pen/gOBBOPx) |
| 100 | betty#0693 | [Codepen](https://codepen.io/betty-hu/pen/GRYYObd) |
| 101 | Rey#1878 | [codepen](https://codepen.io/yfatgmpc-the-bold/pen/LYggepj) |
| 102 | ssshane#0673 | [Codepen](https://codepen.io/sam6091260/pen/XWxxVOe) |
| 102 | homer#1525 | [Codepen](https://codepen.io/Buckhorn/pen/MWPPBEx) |
| 103 | FiReBrO#0557 | [Codepen](https://codepen.io/firebro42/pen/Exddrbe) |
| 104 | 阿榮#8277 | [Codepen](https://codepen.io/codeitaday/pen/YzJJeVm) |
| 105 | Tim123#8361 | [Codepen](https://codepen.io/Wangtim4/pen/MWPzypv) |
| 106 | wendyli#2155 | [Codepen](https://codepen.io/rockayumitw/pen/dygQgxx?editors=1011) |
| 107 | JasonChang#7847 | [Codepen](https://codepen.io/jsonChangJava/pen/poxQMjB) |
| 108 | Sonia Wu#7154 | [Codepen](https://codepen.io/YUJOU/pen/KKGbwwJ) |
| 109 | NathanJames#8120 | [Codepen](https://codepen.io/ufo060204/pen/LYgMLdY) |
| 110 | Jenny真#7532 | [CodePen](https://codepen.io/wei-chen-wu/pen/BaqvdwO) |
| 111 | weiting#3489 | [CodePen](https://codepen.io/weiting14/pen/rNqPpZN) |
| 111 | 狸貓#5863 | [CodePen](https://codepen.io/tanuki320/pen/vYVbPyq) |
| 112 | 東東#5015 | [Codepen](https://codepen.io/wearymask/pen/zYmbBXM) |
| 113 | 羽毛#5463 | [Codepen](https://codepen.io/KYuFeather/pen/jOeJrXG) |
| 114 | lishuan#3698 | [Codepen](https://codepen.io/lishuan/pen/wvYOgza) |
| 115 | 小明#4408 | [Codepen](https://codepen.io/ujlylmbv-the-lessful/pen/KKGELRP) |
| 116 | Jaredlee#5887 | [Codepen](https://codepen.io/jared-lee/pen/NWOmzwE) |
| 117 | 喬喬#2824 | [Codepen](https://codepen.io/joanne-wei/pen/QWZPeVa) |
| 118 | 杰_jie#9088 | [Codepen](https://codepen.io/hmj8805/pen/yLRWePv) |
| 119 | FanJJ#8061 | [Codepen](https://codepen.io/yfchenn/pen/gOBJpRo) |
| 120 | Tami#6742 | [Codepen](https://codepen.io/wqsdqbjn-the-vuer/pen/MWPdrZB) |
| 121 | 柚子#3958 | [Codepen](https://codepen.io/as6625998/pen/rNqgQzW) |
| 122 | 又竹#7302 | [Codepen](https://codepen.io/YO_ZU/pen/VwEJRRx) |
| 123 | QOO#8446 | [Codepen](https://codepen.io/QOOQOOQ/pen/WNaVXvg) |
| 124 | 小魚#8614 | [Codepen](https://codepen.io/gizelliang/pen/gOQYxjJ) |
| 125 | pss940909#8650 | [Codepen](https://codepen.io/pss940909/pen/QWJbaxz) |
| 126 | 路人ADCB#9851 |[Codepen](https://codepen.io/markyourpage/pen/NWEGaKE)|
|127|cmlb0212|[Codepen](https://codepen.io/Chungmin0212/pen/wvQKbEZ)|