Using .before(); and .after(); to wrap elements
jquery
Solution
That's just not how the jQuery API works. At all.
`.before()`:
Insert content, specified by the parameter, before each element in the set of matched elements.
`.after()`:
Insert content, specified by the parameter, after each element in the set of matched elements.
Don't think in terms of open- and close-tags. Think in terms of actual elements.
You are probably looking for `.wrapAll()`.
$('label').each(function () {
$(this).next('input, select').andSelf().wrapAll('<div class="formItem"/>');
});
Problem
I'm trying to wrap `<label>`, `<input type="text" />`, and `<select>` elements with `<div class="formItem"></div>` to fix some positioning on a form that I can't directly edit. For some reason, when I try to use the following code: ``` $("label").before("<div class=\"formItem\">"); $("input[type=text]").after("</div>"); $("select").after("</div>"); ``` It doesn't work. It just adds `<div class="formItem"></div>` before every `<label>` which doesn't help me. I've taken a look at `.wrap();` but it isn't clear how I can use that to wrap multiple elements like I'm trying to do. Here's an example of the HTML markup: ``` <label>Text Box</label> <input type="text" name="Text Box" /> <label>Select Menu</label> <select name="Select Menu"> <option>Example</option> </select> ``` There's about 10 sets, 9 text boxes, and 1 select box if that matters.