title: is there a JSON solution to dynamic generate href in html?
body: <p>I am making an html page that would show dynamic href links that are controlled by JSON.</p>
  <pre><code> &lt;a href=&quot;https://wa.me/923002546363&quot; target=&quot;_blank&quot;&gt;open chat&lt;/a&gt;
  </code></pre>
  <p>I have built the following HTML code that shows mobile numbers on the HTML page. But I couldn't convert that JSON file's mobile numbers into href as shown above. So, when we add a new number, it automatically appears on the front-end as a hyper-link that we can use to open chat.</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang=&quot;en&quot;&gt;
  &lt;head&gt;
      &lt;meta charset=&quot;UTF-8&quot;&gt;
      &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
      &lt;title&gt;WhatsApp Chat Software&lt;/title&gt;
  
  
  &lt;body&gt;
      &lt;div id=&quot;myData&quot;&gt;&lt;/div&gt;
      &lt;script&gt;
          fetch('number.json')
              .then(function (response) {
                  return response.json();
              })
              .then(function (data) {
                  appendData(data);
              })
              .catch(function (err) {
                  console.log('error: ' + err);
              });
          function appendData(data) {
              var mainContainer = document.getElementById(&quot;myData&quot;);
              for (var i = 0; i &lt; data.length; i++) {
                  var div = document.createElement(&quot;div&quot;);
                  div.innerHTML = 'Mobile No: ' + data[i].MobileNo
                  
                  mainContainer.appendChild(div);
              }
          }
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>below is the number.json</p>
  <pre><code>[
      {
          &quot;id&quot;: &quot;1&quot;,
          &quot;MobileNo&quot;: &quot;923002546363&quot;
  
      },
      {
          &quot;id&quot;: &quot;2&quot;,
          &quot;MobileNo&quot;: &quot;923343676143&quot;
  
      }
  ]
  </code></pre>