How to apply border on input?

Question

I'm amazed this works: demo

<span>
<input type="checkbox" />
</span>

span{
    border: 1px solid red;
}

But this doesn't work: demo

<input type="checkbox" />

$('input').wrap('<span />').css('border','1px solid red');

Answer 1

You need to apply the border on <span> element, not <input> so you can traverse up one level using .parent():

$('input').wrap('<span />').parent().css('border','1px solid red');

Updated Fiddle