[jQuery] Surrounding pairs of label+input with a div?
I have the following HTML within a form
<!-- height -->
<label for="height">
Height (cm)
</label>
<input id="height" name="height" type="text"
class="textbox validator-required alphanumeric"/>
<!-- weight -->
<label for="weight">
Weight (kgs)
</label>
<input id="weight" name="weight" type="text"
class="textbox validator-required alphanumeric"/>
Would like to turn it into:
<div class="field">
<label for="weight">
Weight (kgs)
</label>
<input id="weight" name="weight" type="text"
class="textbox validator-required alphanumeric"/>
</div>
I suppose I should somehow loop through all the labels, and for each
find the next input. Then make a selection of this union and apply a
wrapAll('<div class='field'>)
But how exactly do I do this using jQuery manipulators?
Kristian