Assuming that you have a database that is storing the values (this would be the only way to store the total values) then you would create an interval timer that would perform the http request to get the results on frequency that is not too often.

The example I’m giving is in pure JavaScript, so it should work. You don’t need jQuery for this.

Promise Method:

File: script.js

// Code to execute when window loaded
window.addEventListener('load', () => {

   // Main function to retrieve results
   const getResults = () => {
      fetch('/url/to/getResults.php')
         .then(response => {
             const json = response.json();
             if (response.ok) {
                return json;
             }
             return json.then(data => Promise.reject(data));
         })
         .then(jsonData => {
             const total = parseInt(jsonData.xs) + parseInt(jsonData.cb) + parseInt(jsonData.fp);
             document.querySelector('#count1').innerHTML = jsonData.xs;
             document.querySelector('#count2').innerHTML = jsonData.cb;
             document.querySelector('#count3').innerHTML = jsonData.fp;
             document.querySelector('#total').innerHTML = total;
         })
         .catch(error => {
             console.log('ERROR', error);
         });
   };

   // Get an update results every 60 seconds
   const interval = setInterval(getResults, 60000);
});

Async/Await Method:

window.addEventListener('load', () => {

   // Main function to retrieve results
   const getResults = async () => {
      try {
         const response = await fetch('/url/to/getResults.php');
         const responseJSON = await response.json();
         const total = parseInt(jsonData.xs) + parseInt(jsonData.cb) + parseInt(jsonData.fp);
         document.querySelector('#count1').innerHTML = jsonData.xs;
         document.querySelector('#count2').innerHTML = jsonData.cb;
         document.querySelector('#count3').innerHTML = jsonData.fp;
         document.querySelector('#total').innerHTML = total;
      } catch (error) {
         console.log('ERROR', error);
      }
   };

   // Get an update results every 60 seconds
   const interval = setInterval(await getResults, 60000);
});

I want to make a real-time count of the total function of the javascript that all user can see when he visit my site.
For example, there are 3 visitors now I want to total how many successful Javascript executed they do that the count don’t reset when the page refresh and are all visible to all user who visit.

html:

<div class="row">
<div class="col">
<div class="card-profile-stats d-flex justify-content-center mt-md-5">
<div>
<span class="heading" id="count1">0</span>
<span class="badge badge-success">Count 1</span>
</div>
<div>
<span class="heading" id="count2">0</span>
<span class="badge badge-danger">Count 2</span>
</div>
<div>
<span class="heading" id="count3">0</span>
<span class="badge badge-info">Count 3</span>
</div>
<div>
<span class="heading" id="all">0</span>
<span class="badge badge-info">Total</span>
</div>
</div>
</div>
</div>

js:

function startfunc() {
    var xs = 0;
    var cb = 0;
    var fp = 0;
    $.ajax({
    url: 'urlhere.php',
    type: 'GET',
    async: true,
    success: //some of my code here
                    
    var total = parseInt(xs) + parseInt(cb) + parseInt(fp);
    $('#count1').html(xs);
    $('#count2').html(cb);
    $('#count3').html(fp);
    $('#all').html(total);