Document Dom

<!DOCTYPE html>
<html>
<body>

<img src="https://www.closetag.com/images/photo1.jpg" alt="flower" width="150" height="150">
<img src="https://www.closetag.com/images/photo2.jpg" alt="flower" width="150" height="150">
<img src="https://www.closetag.com/images/photo3.jpg" alt="Smiley face" width="150" height="150">

<p>Click the button to add a black dotted border of the Three image in the document</p>
 <button type="button" id="button">Try It</button>
 
    <script>
    let button = document.getElementById('button');
    let images = document.images[2]; 
    button.addEventListener("click",()=>{
    images.style.border = "2px dotted red";
    });
	</script>
    
</body>
</html>

​x
 
<!DOCTYPE html>
<html>
<body>
​
<img src="https://www.closetag.com/images/photo1.jpg" alt="flower" width="150" height="150">
<img src="https://www.closetag.com/images/photo2.jpg" alt="flower" width="150" height="150">
<img src="https://www.closetag.com/images/photo3.jpg" alt="Smiley face" width="150" height="150">
​
<p>Click the button to add a black dotted border of the Three image in the document</p>
 <button type="button" id="button">Try It</button>
 
    <script>
    let button = document.getElementById('button');
    let images = document.images[2]; 
    button.addEventListener("click",()=>{
    images.style.border = "2px dotted red";
    });
    </script>
    
</body>
</html>