How do I make these fill bars fill in order?

Hi name’s Ted.

I have a problem with my interaction interface and I’m trying to get the children ( there are 9 fill image labels ), but when I go to make them visible in a for loop they do not appear in order ( from starting on the left, ending on the right ), to give it a nice interaction-bar-fill-effect.

How can I make them go in order?

Script:

local holding = false
UserInputService.InputBegan:Connect(function(input)
	if input.UserInputType == Enum.UserInputType.MouseButton1 then
		holding = true 
		print("Collecting")
		local Prompt = workspace:FindFirstChild('Prompt')
		local fills = Prompt.BillboardGui.Circle:GetChildren()
		
		print(fills)
		
		for i,v in pairs(Prompt.BillboardGui.Circle:GetChildren()) do
			print(fills)
			fills[1].Visible = true
			wait(0.2)
			fills[2].Visible = true
			wait(0.2)
			fills[3].Visible = true
			wait(0.2)
			fills[4].Visible = true
			wait(0.2)
			fills[5].Visible = true
			wait(0.2)
			fills[6].Visible = true
			wait(0.2)
			fills[7].Visible = true
			wait(0.2)
			fills[8].Visible = true
			wait(0.2)
			fills[9].Visible = true
		end
	end
end)


Instead of doing

for i, v in pairs

try using ipairs

for i, v in ipairs

This makes it so that it loops through in order.

That doesn’t seem like it worked.

I guess I’ve found the solution without using ipairs or LayoutOrder.

local Prompt = workspace:FindFirstChild('Prompt')
local fills = Prompt.BillboardGui.Circle:GetChildren()

for i = 1,#fills do
	wait(.5)
	local temp = "Fill"..tostring(i)
	Prompt.BillboardGui.Circle[temp].Visible = true
end

Place: Gui visible in order.rbxl (29.8 KB)
GUI only: GuiModel.rbxm (3.0 KB)