找到正确的路径ajax / wordpress

I am trying to load infinity.php when i click on the button, however i can't seem to get it right. any ideas? i assume it is something that has to do with:

    xmlhttp.open("GET", "get_template_directory_uri();" + "/infinity.php",true);"

but i can't figure out how to make the right path for the life of me.

  function loadXMLDoc(){

      var xmlhttp;

      if (window.XMLHttpRequest){

         xmlhttp=new XMLHttpRequest();

      }

      xmlhttp.onreadystatechange=function(){

         if (xmlhttp.readyState==4 && xmlhttp.status==200){

             document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

         }
   }

   xmlhttp.open("GET", "get_template_directory_uri();" + "/infinity.php",true);

   xmlhttp.send();

 }

</script>

<div id="myDiv">Let AJAX change this text</div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>

Assuming this is being generated from a PHP page, you can echo the response of get_template_directory_uri() into the JavaScript, or set it to a JavaScript variable.

xmlhttp.open("GET", "<?php echo get_template_directory_uri(); ?>/infinity.php",true);

Or

var template_directory_uri = "<?php echo get_template_directory_uri(); ?>";
xmlhttp.open("GET", template_directory_uri+"/infinity.php", true);