How do I dynamically assign a value inside an HTML element?

This is what you will need for the html…

<html>  
  <head>
      <title></title>
      <script src="https://apis.google.com/js/platform.js"></script>
      <script>
        async function createButton() {console.log("Create new Div running...") 
          var myButtonTitle="xxxxx"
          var myChannel = "LuisMetalKid"
          var myDIV = document.createElement("DIV");
          var divTitle = document.createTextNode(myButtonTitle);
          myDIV.id = "youtubeContainer";
          myDIV.appendChild(divTitle);
          document.body.appendChild(myDIV)  

          document.getElementById("youtubeContainer").innerHTML = ('<div class="g-ytsubscribe" data-channel='+myChannel+' data-layout="default" data-count="default"></div>');
        }

        createButton();
      </script>
  </head>

  <body>   
      
 
  </body>
</html>

When changing → “myChannel” <— manualy it already works.

All you have to do now, is to get data from your site to the HTML.

DATA = “LuisMetalKid” (for example")

…or…

DATA = “UCZTlGPEnQ66TFG0m6Wa3KFQ”