Question

What am I doing wrong, my html is rendered as such:

<td colspan="2"><input id="ctl00_ContentPlaceHolder1_Login1_RememberMe"   
type="checkbox" name="ctl00$ContentPlaceHolder1$Login1$RememberMe" />  
<label for="ctl00_ContentPlaceHolder1_Login1_RememberMe">Remember me next time.  
</label></td>

I want to wrap everything inside the TD with a span.
The idea is to increase the font size of the text "Remember me next time."

I have this so far:

$(document).ready(function() {
        $("input:checkbox").css("border", "none");

        //$("input:checkbox").parent().addclass("checkboxtd");

        var parentTd = $("input:checkbox").parent();
        var prevToCheckBox = $("input:checkbox").prev();

        $(prevToCheckBox).css("border", "solid 1px red"); alert(prevToCheckBox);
        alert(prevToCheckBox.html());

        var parentofParent = parentTd.parent();

        $(parentTd).prepend("<span>");
        $(parentTd).append("</span>"); //+ "</span>"

        //parentTd.before("<div class="checkboxtd"></div>");
        alert(parentTd.parent().html());

        //        $("input:checkbox").css("border", "none").prepend("<span>ss");
        //        $("input:checkbox").css("border", "none").prepend("<span>ss");
        //        $("h2").prepend("<span>ss");
        //        $( h2 ).append("</span>"); //+ "</span>"
    });

Output from alert(parentTd.parent().html());

<TD colSpan=2><INPUT id=ctl00_ContentPlaceHolder1_Login1_RememberMe 
style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; BORDER-LEFT: medium none; BORDER-BOTTOM: medium none" type=checkbox name=ctl00$ContentPlaceHolder1$Login1$RememberMe>  
<LABEL for=ctl00_ContentPlaceHolder1_Login1_RememberMe>Remember me next time.
</LABEL></SPAN></TD>

Answer 1

Remove these two lines:

$(parentTd).prepend("<span>");
$(parentTd).append("</span>"); //+ "</span>"

And use this line:

$(parentTd).wrapInner("<span></span>");

Answer 2

Try manipulating the HTML directly:

var parentTdHTML = parentTd.html();
parentTd.html("<span>" + parentTdHTML + "</span>");

However, as outis said as a comment to your question, what you re doing is unnecessary. You ve properly surrounded the text you wish to stylize with a <label>, which means you can easily change the styling via CSS:

label {
    font-size: 110%;
}

友情链接