full code here with minor redactions
<!--- Prints out the last game scores for teams-->
<html>
<head>
<title>Score Board</title>
<style>
#bottomleft {
position: absolute;
bottom: 60px;
left: 20px;
width: 500px;
background-color: white;
}
#bottomright {
position: absolute;
bottom: 60px;
left: 550px;
width: 450px;
background-color: white;
}
// how do you refresh the get data without refreshing the page?
</style>
<script src= "/wp-includes/js/jquery/jquery.js"></script>
<script src="/wp-includes/js/jquery.easy-ticker.js"></script>
<iframe src="https://beta.sharptools.io/dashboard/view/6XXXXXXX2APVq?kiosk=true"
height="800" width="1300" style="border:none;">
</iframe>
<div id="bottomleft">
<b>Recent results:</b>
<div class="myWrapper">
<div>
<div id="R1"></div>
<div id="R2"></div>
<div id="R3"></div>
<div id="R4"></div>
</div>
</div>
</div>
<div id="bottomright">
<b>Upcoming events:</b>
<div class="rightWrapper">
<div>
<div id="R5"></div>
<div id="R6"></div>
<div id="R7"></div>
<div id="R8"></div>
</div>
</div>
</div>
<script>
var ChelseaResults = [];
var CowboysResults = [];
var JetsResults = [];
var JuventusResults = [];
var ChelseaSchedule = [];
var CowboysSchedule = [];
var JetsSchedule = [];
var JuventusSchedule = [];
var Chelsea = "133610";
var Cowboys = "134934";
var Jets = "134921";
var Juventus = "133676";
function teamResults(teamID ,printArray){ //pulls the last 5 games scored for team based on teamID
console.log("team results function")
var varURL = "https://www.thesportsdb.com/api/v1/json/1/eventslast.php?id="+teamID;
jQuery.getJSON(varURL, function(result){
var count = result.results.length;
var nextGame = []; //declare nextGame as array
var tempStr = ""; //declare tempStr as string
for (i = 0; i < count; i++) { //loops through entire set of events and pushes them into NextGame array
tempStr = "" + result.results[i].strHomeTeam + ": " + result.results[i].intHomeScore + " - " + result.results[i].strAwayTeam + ": " + result.results[i].intAwayScore + " (" + result.results[i].dateEvent + ")";
nextGame.push(tempStr)
}
if (teamID == Chelsea){
ChelseaResults = [...nextGame];
printArray(ChelseaResults, 1);
} else if (teamID == Cowboys){
CowboysResults = [...nextGame];
printArray(CowboysResults, 2);
} else if (teamID == Jets) {
JetsResults = [...nextGame];
printArray(JetsResults, 3);
} else {
JuventusResults = [...nextGame];
printArray(JuventusResults, 4);
}
});
};
function teamSchedule(teamID ,printArray){ //pulls team schedule
console.log("team schedule function")
var varURL = "https://www.thesportsdb.com/api/v1/json/1/eventsnext.php?id="+teamID;
jQuery.getJSON(varURL, function(result){
var count = result.events.length;
var nextGame = []; //declare nextGame as array
var tempStr = ""; //declare tempStr as string
for (i = 0; i < count; i++) { //loops through entire set of events and pushes them into NextGame array
tempStr = "" + result.events[i].dateEvent + " " + result.events[i].strEvent;
nextGame.push(tempStr)
}
if (teamID == Chelsea){
ChelseaSchedule = [...nextGame];
printArray(ChelseaSchedule, 5);
} else if (teamID == Cowboys){
CowboysSchedule = [...nextGame];
printArray(CowboysSchedule, 6);
} else if (teamID == Jets) {
JetsSchedule = [...nextGame];
printArray(JetsSchedule, 7);
} else {
JuventusSchedule = [...nextGame];
printArray(JuventusSchedule, 8);
}
});
};
function printArray(arraytoprint, index){ //only printing last element even though full list has been loaded ... maybe change this to a case switch statement
console.log(arraytoprint[0])
if (index == 1){
document.getElementById("R1").innerHTML = arraytoprint[0];
} else if (index == 2){
document.getElementById("R2").innerHTML = arraytoprint[0];
} else if (index == 3){
document.getElementById("R3").innerHTML = arraytoprint[0];
} else if (index == 4){
document.getElementById("R4").innerHTML = arraytoprint[0];
} else if (index == 5){
document.getElementById("R5").innerHTML = arraytoprint[0];
} else if (index == 6){
document.getElementById("R6").innerHTML = arraytoprint[0];
} else if (index == 7){
document.getElementById("R7").innerHTML = arraytoprint[0];
} else {
document.getElementById("R8").innerHTML = arraytoprint[0];
}
}
teamResults(Chelsea, printArray);
teamResults(Cowboys, printArray);
teamResults(Jets, printArray);
teamResults(Juventus, printArray);
teamSchedule(Chelsea, printArray);
teamSchedule(Cowboys, printArray);
teamSchedule(Jets, printArray);
teamSchedule(Juventus, printArray);
jQuery(document).ready(function(){
jQuery('.myWrapper').easyTicker({
direction: 'up',
easing: 'swing',
speed: 'slow', //speed of transition: can be slow medium or fast or anything in ms
interval: 4000, //time till next transition (in ms)
height: 'auto', //auto fits to all content, or can by x px X x px
visible: 2, //how many in list visible at a time, 0 means all
mousePause: true, //if ticker can be stopped by mouse pause
controls: {
up: '',
down: '',
toggle: '',
playText: 'Play',
stopText: 'Stop'
},
callbacks: {
before: false,
after: false
}
});
});
jQuery(document).ready(function(){
jQuery('.rightWrapper').easyTicker({
direction: 'up',
easing: 'swing',
speed: 'slow', //speed of transition: can be slow medium or fast or anything in ms
interval: 4000, //time till next transition (in ms)
height: 'auto', //auto fits to all content, or can by x px X x px
visible: 2, //how many in list visible at a time, 0 means all
mousePause: true, //if ticker can be stopped by mouse pause
controls: {
up: '',
down: '',
toggle: '',
playText: 'Play',
stopText: 'Stop'
},
callbacks: {
before: false,
after: false
}
});
});
</script>
</head>
<body>
</body>
</html>
, thank again