Question

Is it possible to shorten these jQuery snippets by chaining them together? For the second chain, I’d like to get rid of the w class if possible.

$('#content').prepend("<h1 />");
$('#content h1').append( $('#content>p:first strong').html() );
$('#content>p:first strong').parent().remove();

$('font').wrapInner('<p class="w"/>');
$("p.w").unwrap().unwrap();

---

Edit: Let me clarify my second jQuery snippet. I’m cleaning up old HTML markup that looks like this:

<div id="content">
    <p>
        <font>
            <b>Sample Title</b>
            <br>
            More sample text.
        </font>
    </p>
</div>

And changing it to this:

<div id="content">
    <p>
        <b>Sample Title</b>
        <br>
        More sample text.
    </p>
</div>

Answer 1

This is how I would do it:

var content = $( '#content' )[0];
var para1 = $( content ).children( 'p' )[0];
var text = $( para1 ).children( 'strong' ).text();

$( '<h1>', { text: text }).prependTo( content );
$( para1 ).remove();

---

As of jQuery 1.4, the second argument to jQuery() can accept a map
consisting of a superset of the properties that can be passed to the
.attr() method. Furthermore, any event type can be passed in, and the
following jQuery methods can be called: val, css, html, text, data,
width, height, or offset. The name “class” must be quoted in the map
since it is a JavaScript reserved word, and “className” cannot be used
since it is not the correct attribute name.

From the docs: http://api.jquery.com/jQuery/#jQuery2

So, you can pass an object literal as the second argument. That object literal “initializes” the newly created DOM element (the H1 element in our case).