JSFiddle - React, Tailwind, and code Playground

HTML

<div id="div1">
    <img id="img1" src="https://www.gstatic.com/webp/gallery/1.sm.jpg" />
</div>

JavaScript

window.a = {
    div1: $('#div1'),
    img1: function() {
            return $('#div1 > img')
        }
};

function toggle(e){
    console.log(e.target)
    a.div1.html(/1/.test(e.target.src) ? '<img id="img2" src="https://www.gstatic.com/webp/gallery/2.sm.jpg" />' : $('<img id="img1" src="https://www.gstatic.com/webp/gallery/1.sm.jpg" />').click(toggle));
    //a.img1().click(toggle);
    $("#img2").one("click", function(){    
 a.img1().attr({'src':'https://www.gstatic.com/webp/gallery/3.sm.jpg', "id":"img3"})
      .click(toggle)
        
    });
}

a.img1().click(toggle);