Merely swapping out the text for an image won't suffice, as the embedded script specifically seeks the href attribute of the clicked element (event.target). When an image is within a link tag, the target element becomes the image itself and lacks an href attribute.
To address this issue, you can intercept the event on any images inside these links, prevent it from progressing further, and simulate a click on the parent hyperlink instead.
Example without depending on jQuery
var lead_images = document.querySelectorAll('.lead_button img');
for(var i=0; i<lead_images.length; i++)
{
lead_images[i].addEventListener('click', function(e){
e.stopPropagation();
e.preventDefault();
this.parentNode.click();
});
}
<a class="lead_button" href="https://example.com/booking" onclick="openBookingForm(event)">
<img src="image.jpg" alt="">
</a>
<script type="text/javascript" src="https://your-script.js"></script>
Example using jQuery
$('.lead_button img').click(function(e){
e.stopPropagation();
e.preventDefault();
$(this).parent().click();
});
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<a class="lead_button" href="https://example.com/booking" onclick="openBookingForm(event)">
<img src="image.jpg" alt="">
</a>
<script type="text/javascript" src="https://your-script.js"></script>