Refresh data in 5 seconds

by ananyaneogi

HTML

<table>
  <tr>
    <th>Name</th>
    <th>EMail</th>
    <th>Phone No.</th>
  </tr>
  <tr id="userDataRow">
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>

JavaScript

/* const table = $('#userTable').find('tbody');
const documentFrg = document.createDocumentFragment();
 const row = document.createElement('tr'); */

/* function fetchUser() {
  $(table).find('tr').not(':first').remove();
 $.ajax({
  url: 'https://randomuser.me/api/',
  dataType: 'json',
  success: function(data) {
    const userData = data.results[0];
    row.innerHTML = `<td>${userData.name.title} ${userData.name.first} ${userData.name.last}</td>
          <td>${userData.email}</td>
           <td>${userData.phone}</td>`
    documentFrg.appendChild(row);
    table.append(documentFrg);
  }
});
} */

const tableCols = $('#userDataRow').children();
console.log(tableCols);
const documentFrg = document.createDocumentFragment();
 
function fetchUser() {
 $.ajax({
  url: 'https://randomuser.me/api/',
  dataType: 'json',
  success: function(data) {
    const userData = data.results[0];
    $(tableCols[0]).text(`${userData.name.title} ${userData.name.first} ${userData.name.last}`);
    $(tableCols[1]).text(`${userData.email}`);
    $(tableCols[2]).text(`${userData.phone}`);
  }
});
}

fetchUser(); 
/* setInterval(fetchUser, 5000);
 */