A label must be programmatically associated with a form element. All user interface components, e.g. form elements, links, etc, the name, and role can be programmatically determined. States, properties and values that can be set bye the user can be programmatically set and user agents (including assitive technology) are notified of these changes.
<h3>Donut Selection</h3>
<p>Choose the type of donut(s) you would like then select
the "purchase donuts" button.</p>
<form action="http://example.com/donut" method="post">
<p>
<label>First name:</label>
<input type="text" name="firstname" /><br />
<input type="radio" name="flavor" value="chocolate" />
<label>Chocolate</label><br/>
<input type="radio" name="flavor" value="cream"/>
<label>Cream Filled</label><br/>
<input type="radio" name="flavor" value="honey"/>
<label>Honey Glazed</label><br/>
<input type="submit" value="Purchase Donuts"/>
</p>
</form>Choose the type of donut(s) you would like then select the "purchase donuts" button.
<form action="http://example.com/donut" method="post">
<p>
<label for="firstname">First name:</label>
<input type="text" name="firstname" id="firstname" /><br />
<fieldset>
<legend>Donut Flavors</legend>
<input type="radio" name="flavor" id="choc" value="chocolate" />
<label for="choc">Chocolate</label><br/>
<input type="radio" name="flavor" id="cream" value="cream"/>
<label for="cream">Cream Filled</label><br/>
<input type="radio" name="flavor" id="honey" value="honey"/>
<label for="honey">Honey Glazed</label><br/>
</fieldset>
<input type="submit" value="Purchase Donuts"/>
</p>
</form>Choose the type of donut(s) you would like then select the "purchase donuts" button.