Could someone help me with a javascript question?

I have an HTML page that loads a javascript function through an Ajax call, the function is declared inside a script tag like this:

<script>
    function greet(){
       return 'Hello Word(1)';
    }
</script>

Through the Ajax call I fetch a snippet of HTML code on the server, and this HTML in turn contains this tag with the function in question. Well, if I make 2 Ajax calls to get the same piece of HTML code on my page, it means that my greet() function will be declared twice, but the last declaration will override the first.

However, there is a detail, at each Ajax call, the function that is declared in the tag inside the HTML snippet, comes with a different return, for example: in the first Ajax call, the return of the greeting() function is declared to be the string 'Hellow Word (1)', in the second Ajax call, the same function comes with the return declared as 'Hellow Word (2)', in the third ajax call the same function comes with the return 'Hellow Word ( 3)', and so on.

The problem happens when I run the function after it is loaded on the page, in the first Ajax, I call the greeting() function and the return is exactly what I expected ('Hellow Word (1)'), but when calling the function after the second Ajax, the return is still 'Hellow Word(1)', that is, it is as if the function has not been updated. And the most bizarre thing is that if I inspect the HTML using Chrome's DevTools, I can see that the function is declared with the return being 'Hellow Word (2)', but when executing it the return comes from the first function . Could someone explain to me why this happens? Am I missing some default behavior of the language?