Update index.html

Author: bbauska

index.html

@@ -146,13 +146,16 @@ <h3>1. Change the Content of an Element</h3>
 </pre>
 <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
 <!--~~~~~~~~~~~~~~~~~~~~~~~ 01. change text and make bold using innerHTML ~~~~~~~~~~~~~~~~~~~~~~-->
+<a href="https://codepen.io/editor/BBauska/pen/019e29fd-1fb3-7ccc-ac0a-474f3e6c17dd" 
+  target="_blank" rel="noopener noreferrer">
 <img class="displayed"
     src="./images/image001.gif?raw=true"
     loading="lazy"
     style="width:531px; height:94px;"
     aria-label="Change text, make bold using innerHTML"
     title="Change text, make bold using innerHTML"
     alt="Change text, make bold using innerHTML." />
+</a>
 <!-- image001.gif -->
 <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
 <h4>In this example</h4>
@@ -222,7 +225,7 @@ <h4>Output:</h4>
 <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
 <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~ 02. highlight, remove, toggle text in class ~~~~~~~~~~~~~~~~~~~~-->
 <p align="center" >
-<a href="" 
+<a href="https://codepen.io/editor/BBauska/pen/019e29ff-7d30-72c2-b968-91e49dcb8d47" 
   target="_blank" rel="noopener noreferrer">
   <img class="displayed"
     src="./images/image002.gif?raw=true"
@@ -391,7 +394,7 @@ <h4>Output:</h4>
 <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
 <!--~~~~~~~~~~~~~~~~~~ 03. update heading font size, background color using class ~~~~~~~~~~~~~~-->
 <p align="center" >
-<a href="" 
+<a href="https://codepen.io/editor/BBauska/pen/019e2a02-9ea4-7ea7-973f-f2abd1c889bf" 
   target="_blank" rel="noopener noreferrer">
   <img class="displayed"
     src="./images/image003.gif?raw=true"
@@ -453,7 +456,7 @@ <h4>Output:</h4>
 <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
 <!--~~~~~~~~~~~~~~~~~~~~~~~ 04. Update font size, background color using class ~~~~~~~~~~~~~~~~~-->
 <p align="center" >
-<a href="" 
+<a href="https://codepen.io/editor/BBauska/pen/019e2a02-9ea4-7ea7-973f-f2abd1c889bf"
   target="_blank" rel="noopener noreferrer">
   <img class="displayed"
     src="./images/image004.gif?raw=true"