JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="image-gallery" class="gallery">
     <li data-img-id="id1" value="1" data-thumb="images/72x72.jpg">
         <img  src="images/340x400.jpg" /> </li>
     <li data-img-id="id2" data-thumb="images/72x72.jpg">
         <img  src="images/340x400.jpg" /> </li>
     <li data-img-id="id3" data-thumb="images/72x72.jpg">
         <img src="images/340x400.jpg" /> </li>
     <li data-img-id="id4" data-thumb="images/72x72.jpg">
         <img  src="images/340x400.jpg" /> </li>
     <li data-img-id="id5" data-thumb="images/72x72.jpg">
         <img src="images/340x400.jpg" /> </li>
</ul>

<div class="styled-select">

 <select class="show-labels">
     <option id="id1" value="1"> 1</option>
     <option id="id2" value="2"> 2</option>
     <option id="id3" value="3"> 3</option>
     <option id="id4" value="4"> 4</option>
     <option id="id5" value="5"> 5</option>
 </select>
 
 </div>

JavaScript

$(function () {
  $("#image-gallery li").click(function() {
    alert(this.value); // get id of clicked li
});
});