After a lot of searching for how to properly refer to one item from another, I found this minimal example that showcases how to refer to an Organization item as a branchOf from a Hotel item. It defines the attribute itemprop="branchOf" on the Organization, which becomes a property of the Hotel item after it references it.
<div itemprop="branchOf" itemscope itemtype="http://schema.org/Organization" id="schema-organization">
<h1 itemprop="name">The Hotel Chain</h1>
</div>
<div itemscope itemtype="http://schema.org/Hotel" itemref="schema-organization">
<h2 itemprop="name">Hotel Location 1</h2>
</div>
That example validates.
But now I need to add a Person that works for that Organization. I could use the same concept by defining itemprop="worksFor" on the Organization, and then referencing that from my Person, like so:
<div itemprop="worksFor" itemscope itemtype="http://schema.org/Organization" id="schema-organization">
<h1 itemprop="name">The Hotel Chain</h1>
</div>
<div itemscope itemtype="http://schema.org/Hotel" itemref="schema-organization">
<h2 itemprop="name">Hotel Location 1</h2>
</div>
<div itemscope itemtype="http://schema.org/Person" itemref="schema-organization">
<div itemprop="name">John Doe</div>
</div>
And the Person correctly gets its worksFor attribute to show the Organization here.
But now I have to remove the itemref from the Hotel, otherwise it complains that it doesn't recognize a worksFor attribute. And if I do so, the Hotel is no longer referencing the Organization in any way, therefore it is not a branch of it.
So it seems that it's a either-or situation.
How I can I declare both? The Person needs to work for the Organization, and Hotel needs to be a branch of the Organization.