Jak připojit fuknci rozbalování textu na obrá

dobrý den, mám funkci

<x id="hlaska">
<button onclick="hlaska('muj text)">INFO</button></p>
<p><script>
function hlaska(text, vycistit) {
 var casovac;
 vycistit = (typeof vycistit === "undefined" ? 3 : vycistit;
 var h = document.getElementById("hlaska"
 if (h.className == "zobrazit" && h.innerHTML == text) return;
 
 h.innerHTML = text;
 h.className = "zobrazit";</p>
<p> clearTimeout(casovac);
 casovac = setTimeout(function() {
  h.className = "";
 }, vycistit * 1000)
}
</script>

a v css

#hlaska { position: absolute; right: 20px; top: 60px;}</p>
<p>#hlaska {background: #8933F2; font-weight: bold; color: #000; position: absolute; width: 50%; top: 30%; left: 50%; margin-left: -25%; padding: 1em; top: -10em; transition: top 2s}</p>
<p>#hlaska.zobrazit {top: 10%}</p>
<p>

chci se zeptat, když si na stranky umistim nějaky obrázek, jak na něj umistim tuto funkci? prostě aby po kliku na ten obrázek se zobrazilo to, co se teď zobrazí po kliku na vytvořené tlačítko INFO?

děkuji Vám za rady