wrap label and input in same div

Question

I'm trying to wrap my radio input and its label in a single div but somehow it's not wrapping only the input. My code is:

HTML is :

<div class="payment_processor-section">
    <input id="input_0" class="form-radio" type="radio" checked="checked"  name="payment_processor" value="1">
    <label for="input_0">Credit Card</label>
    <input id="input_1" class="form-radio" type="radio" name="payment_processor" value="0">
    <label for="input_1" style="">I will send payment by check</label>
</div>

Jquery I am trying is:

$('.payment_processor-section input').map(function(index){
    $(this, $("label[for='"+this.id+"']") ).wrapAll('<div class="abc">');
});

Please help.

Answer 1

Try this:

$('.payment_processor-section input').map(function(index){
  $(this).next().andSelf().wrapAll('<div class="abc">');
});

fiddle

Answer 2

Or http://jsfiddle.net/43jdq/

$('.payment_processor-section input').map(function(index){
 $(this).add($("label[for='"+this.id+"']")).wrapAll('<div class="abc">');
});