Question

I would like to change the first TD in the <tr> element I am cloning.

Im cloning and inserting after the last .deals_options tr element

            var $orig = $('.deals_options:first');
            for (var i = 0; i < Math.abs(amount - selectCount); i++) {
                $orig.clone().insertAfter('.deals_options:last');
            }

Works fine, but now inside this tr element .deals_options, I would like to add html inside the first <td>.

How can i insert text in the first td, in the cloned element i am inserting?

Answer 1

You have a couple of options. If you’re really into one-liners (broken here onto multiple lines for clarity):

$orig.clone()
     .insertAfter('.deals_options:last')
     .find('td')
     .first()
     .html("new content");

Live Example | Source

or if you really, really want to set the new content before it’s added to the table:

$orig.clone()
     .find('td:first')
     .html("new content")
     .end()
     .insertAfter('.deals_options:last');

Live Example | Source

end is one of the relatively obscure features of jQuery.

I’m not that into one-liners myself, so for me:

var clone;

// ...then in the loop...
clone = $orig.clone();
clone.find('td').first().html("new content");
clone.insertAfter('.deals_options:last');

Live Example | Source