JSFiddle - React, Tailwind, and code Playground

HTML

<div><img id="main" src="images/team-large.jpg" alt="Img"></div>
                    <ul>
                        <li>
                            <img class="thumbnail" src="images/elek2.jpg" alt="Img" title="Elektronik Alt Sistemler">
                        </li>
                        <li>
                            <img class="thumbnail" src="images/su.jpg" alt="Img" title="Sualtı Akustik Sistemler">
                        </li>
                        <li>
                            <img src="images/yazılım.jpg" class="thumbnail" alt="Img" title="Yazılım, Bilgi Teknolojileri ve Simülasyon">
                        </li>
                    </ul>

JavaScript

var original = $('#main').attr('src');

$('.thumbnail').mouseover(function()
{
   // retrieve image source
   var source = $(this).attr('src'); // retrieve image source of hovered image
   $('#main').attr('src', source); // update main image source
})
.mouseout(function() {
   $('#main').attr('src', original); // restore original image source
});