CODEWITHSUNDEEP
jquery
Karem
Karem

Reputation: 18103

Change a td after cloning the element in jQuery

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?

Upvotes: 0

Views: 698

Answers (2)

T.J. Crowder
T.J. Crowder

Reputation: 1075129

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

Upvotes: 1

Richard Dalton
Richard Dalton

Reputation: 35793

Find the first td in the cloned element and add some text to it:

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

http://jsfiddle.net/Kgrhv/

Upvotes: 1

Related Questions