$('#AddMoreErrors,#AddMoreMime,#AddMoreRemote').live('click',function(){
var newRow = $(this).closest('tr');
$(this).closest('tr').after('<tr class="'+newRow.attr('class')+'">'+newRow.html()+'</tr>').find('span').removeAttr('id').addClass('removetr').html('Del');
});
I wrote the above jquery code and this is what it does: When someone clicks on “add more” it finds the nearest tr, replicates it into another tr and appends it to the first one. Then it finds all the spans, removes its id and adds a new class and changes the text.
Now what surprised me was find('span').removeAttr('id').addClass('removetr').html('Del');
I know I could do removeAttr on span but how did addClass and html also get applied on span?
jQuery returns object of element after each operation on which it is performed, and execution order are from left to right. So its
.removeAttr('id')will be on span and that span object will be returned. Similarly.addClass('removetr')and.html('Del');are performed.