Innerhtml JavaScript Not Working

Go to the second line in Javascript Function. 

    let message = document.querySelector("message");

You are missing the # sign in selecting the message in the query selector

The issue lies in the line where you're selecting the message element. You're missing the # symbol to indicate that you're selecting an element by its ID.

 Here are some possible solutions:

1. Wait for the DOM to load: If you’re trying to update the innerHTML of an element before the element has been added to the DOM, it won’t work. You can either move your script tag down further or add your logic to a function which ought to be called when the document has been loaded. Here’s an example of how to do this:
   window.onload = function () {
     // Add your logic here
   }
   
    

2. Check for typos: Make sure that you’re using the correct spelling of innerHTML. It’s case-sensitive and should be written in camelCase.

3. Use document.querySelector(): If document.getElementById() isn’t working, try using document.querySelector() instead. Here’s an example:
   document.querySelector("#ma").innerHTML = "HELLO";
    

4. Use defer keyword: You can also use the defer keyword with a script to execute it after the DOM has been initialized. Here’s an example:
   <script type=\"text/javascript\" defer>
     // Your script here
   </script>
   
    

<script>
    function myFunction(){
        let user_input = document.querySelector("#user_input");
        let message = document.querySelector("#message"); // Add # before message
        message.innerHTML = "Welcome, user " + user_input.value; // Corrected innerHTML
    }
</script>
By adding #

while assigning the messsage Id using querySelector the "#" is missing.

because you missed adding  the "#"  sign in your querySelector  message