<!--HTML-->
    <style>
.hidden {
    opacity: 0; 
}

.img-modal {
width: 100px; height: auto; background-size: 100%;
    left: 45px;
    top: 20px;
}
    </style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="https://i.imgur.com/resblcf.jpg" id="img" class="img-modal">
<img src="https://i.imgur.com/resblcf.jpg" id="img2" class="img-modal">

<div class="modal hidden">1</div>
    
<script type="text/javascript">
$("#img").click(function() {
$(".modal").toggleClass("hidden").html('11');
});
$("#img2").click(function() {
   $(".modal").toggleClass("hidden").html('22');
});
</script>

<div class="as-console-wrapper"><div class="as-console"></div></div>