Multiple Repeaters on a page

I’m relatively new to Velo. I have a page that uses three separate repeaters, which lists scholarship winners into three separate categories, College, High School and Grade School. All three repeaters are using the same dataset. When the page renders, only the first repeater is displayed and the first 4 rows shows “undefinded” for each field (first image below). When I manually reload the page, it shows exactly how I want it displayed (second image below). How do I get this to work without manually reloading the page? Any help would be appreciated.

Here’s my code…

import wixData from ‘wix-data’;

//Find Names of College Grant Winners
$w.onReady( async function () {
$w(“#collegeRepeater”).onItemReady(($item,itemData,index) => {
$item(“#grantYear”).text = itemData.year
$item(“#fullName”).text = itemData.firstName + " " + itemData.lastName
$item(“#currentSchool”).text = “From " + itemData.fromSchool + " to " +itemData.toSchool
$item(”#grantAmount").text = “$” + itemData.amount.toLocaleString(‘en’)
});

const {items:Grants} = await wixData.query(‘Grants’)
.eq(“type”,“College”)
.descending(“year”)
.descending(“amount”)
.ascending(“lastName”)
.find()
$w(‘#collegeRepeater’).data = Grants

});

//Find Names of High School Grant Winners
$w.onReady( async function () {
$w(“#highschoolRepeater”).onItemReady(($item,itemData,index) => {
$item(“#hsYear”).text = itemData.year
$item(“#hsFullName”).text = itemData.firstName + " " + itemData.lastName
$item(“#hsSchool”).text = “From " + itemData.fromSchool + " to " +itemData.toSchool
$item(”#hsAmount").text = “$” + itemData.amount.toLocaleString(‘en’)
});

const {items:Grants} = await wixData.query(‘Grants’)
.eq(“type”,“High School”)
.descending(“year”)
.descending(“amount”)
.ascending(“lastName”)
.find()
$w(‘#highschoolRepeater’).data = Grants
});

//Find Names of Grade School Grant Winners
$w.onReady( async function () {
$w(“#gsRepeater”).onItemReady(($item,itemData,index) => {
$item(“#gsYear”).text = itemData.year
$item(“#gsFullName”).text = itemData.firstName + " " + itemData.lastName
$item(“#gsSchool”).text = itemData.fromSchool
$item(“#gsAmount”).text = “$” + itemData.amount.toLocaleString(‘en’)
});

const {items:Grants} = await wixData.query(‘Grants’)
.eq(“type”,“Grade School”)
.descending(“year”)
.descending(“amount”)
.ascending(“lastName”)
.find()
$w(‘#gsRepeater’).data = Grants
});

What I see when the page initially loads

What I see when I manually reload the page