Normally, a label element is placed alongside an input element and the for
attribute of the label is the same as the id. This makes it so you can click anywhere on the label text and focus will be given to the input element. This is particularly useful for an input control like a checkbox or radio button because the clickable area of these two input elements is tiny and you need to be a sharpshooter to click them if it were not for the label.
Here is an example. You can click anywhere on the text of the label label text
and the checkbox gets clicked.
But what if you, for some reason, don't know what the id of the control is an advance and you still want to achieve the same effect? Simple. Wrap the label around the input control.
Here is an example. If you view the source code you will see the checkbox has no id
and the label has no for