Adding an image with anchor tag just above the field in a newform.aspx

Question

I am creating a newform.aspx page for cutsom SPList in SPO site. I want to add an image with dynamic text thats embedded within anchor tag, <tr> or <td>.

This image with the dynamic text must be placed immediately above first field of the form.

Assume , I have some fields in the way, employeename, number, address, etc.

So, just above employeename field, I want to add a <tr><td> <a href ==> with < img src=../../someimage.jpg >' + mydynamictext+ ' </td></tr>.

How can I implement this?

I would like to add an attachment button to be able to upload files and images. How this can be done?

This is what I'm adding to new custom form:

        var text='<tr><td class="ms-formlabel" noWrap="nowrap" 
            vAlign="middle" colspan="2">
          <img 
         src="/mysitecollec1/soemmimage.png">
         <a id="loadForm" style="cursor:hand"><u><b>'+ dynamicText+'</b></u>
          </a>           </br>
              <span 
        style="font-weight:normal;"> default texthere </span></td></tr><tr>
            <td>&nbsp;</td></tr>';

           $("input[title='employeen name Required Field']").after(text);

But its not working!

Answer 1

The following code for your reference.

<style>
#ImgContainer {
    position: relative;
    text-align: left;
    color: white;
}
.top-left {
    position: absolute;
    left:100px;
    top: 50px;
    transform: translate(-50%, -50%);
}
</style>
<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
    var dynamicText="my test";
    var text='<tr><td class="ms-formlabel" noWrap="nowrap" vAlign="middle" colspan="2"><a href="#" id="loadForm" style="cursor:hand">'
                +'<div id="ImgContainer">'
                +'<img src="/mysitecollec1/soemmimage.png"/>'
                +'<div class="top-left"><u><b>'+ dynamicText+'</b></u></div>'
                +'</div>'
                +'</a></br>'
            +'<span style="font-weight:normal;"> default texthere </span></td></tr><tr><td>&nbsp;</td></tr>';

    $("input[title='employeen name Required Field']").closest('tr').after(text);     
}); 
</script>