I have a set of manually added product images added into the product description like this:

HTML Code:
<div class="productImagesRow">  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_001.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_002.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_003.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div></div><div class="productImagesRow">  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_004.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_005.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_006.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div></div><div class="productImagesRow">  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_007.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_008.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_009.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div></div><div class="productImagesRow">  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_010.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_011.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_012.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div></div><div class="productImagesRow">  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_013.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_014.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div>  <div class="productImagesColumn"><img src="images/additional/red_arrows_canvas_015.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"></div></div>
How would I make each image open full size in its own 'modal lightbox window' using the bootstrap scripts?

I've tried this:

HTML Code:
<a data-toggle="modal" data-target=".image-modal-lg" href="#image-modal-lg"><img src="images/red-arrows-canvas-001.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"><div class="p-1"></div><span class="imgLink">larger image</span></a>

<a data-toggle="modal" data-target=".image-modal-lg" href="#image-modal-lg"><img src="images/red-arrows-canvas-002.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"><div class="p-1"></div><span class="imgLink">larger image</span></a>

<a data-toggle="modal" data-target=".image-modal-lg" href="#image-modal-lg"><img src="images/red-arrows-canvas-003.jpg" alt="Red Arrows A3 Canvas Prints" title=" Red Arrows A3 Canvas Prints " width="450" height="450"><div class="p-1"></div><span class="imgLink">larger image</span></a>
However that only opens the first image no matter what image you click on.