How do I separate a button in a gui using scripts

[stampelt (stem)]

If you don’t understand what I mean, refer to the image below:

What I want:

What I got:

So I want to separate these Jobs into their own group, I tried using a table to separate but I don’t know where to start with this.

local jobsModule = {
	["Scavenger"] ={
		["Title"] = "Scavenger",
		["Type"] = "Unemployed",
		["Icon"] = "rbxassetid://",
		["ReqGamepass"] = false,
		["PlayerCount"] = nil
	}
}

return jobsModule

local function addJobs()
	for jobName, jobData in pairs(jobsModule) do
		print("Job Name:", jobName.Name)
		local templateButton = jobsSelectFrame.ExampleJob:Clone()
		
		local newJobButton = templateButton:Clone()
		if jobData.Type == "Government" then
			newJobButton.BackgroundColor3 = Color3.fromRGB(128, 141, 158)
		end
		newJobButton.Name = jobName
		newJobButton.Title.Text = jobData.Title
		newJobButton.Icon.Image = jobData.Icon
		newJobButton.Visible = true
		newJobButton.Parent = jobsSelectFrame
	end
end

So how do you think I should do this?

[Reforging]

Assuming you’re using a UIListLayout or UIGridLayout, you can use the LayoutOrder property to position a UI element in a list. An example on how you can make use of this for what you’re trying to do here, would be to assign the categories an odd number (1, 3, 5) and give the ‘jobs’ +1 of the category’s layoutorder. I.E:
[GOVERNMENT] would have a LayoutOrder of 1, and it’s subsequent jobs would have a LayoutOrder of 2