Hi all,
I am working on a simple chat app that user can send text and photos from text input to div.
Here the code
HTML Code:
</div>
<div class="ConLabelDiv">  
<label style="color:blue; ">Conversation</label><br>
</div>
<div class="conDiv"  id="conDivID"  >
<img width=" =100px;" height=" 100px" id="image" />
         <br>  
    </div>
          <br>
          <div class=" myInputtextDiv">
<input style="color:black; " type="text" id="myInput"maxlength="10000">    
<input id="myBtn" type="button" onclick="sendFunction();" value=" Send">
<input  id="fileInput" type="file" style="display: none;" /> 
<input type="button" value="Choose Image!" onclick="document.getElementById('fileInput').click();" />

             </div>
           <br>
     
  <script>

      function sendFunction() {//To send text to conversation box.

     var userName = document.getElementById("myUserName").value;
     var src = document.getElementById("myInput").value;
     var dest = document.getElementById("conDivID");
          
               
            dest.innerHTML += userName + ":" + src+"<br/>";
          
           

            }
         
      }
        </script>
So user when send text it will appear with this username at the front of it like this=> Max:How are you doing?
But when he send image it appear without his name
So how can I my app to put username at front of the sent image that he sent it to div?

thanks for your time