Value undefined after append Jquery

I have some trouble with an appending feature. I use this code:

        $('.videoblock .title').each(function(){            
        var href = $(this).attr('href');
        $('body').append('<input type="text" id="'+i+'" value="'+href+'">');
   开发者_Python百科     $('body').append($(this).attr('title'));            
    }); 

This will return 2 input fields with a value: undefined and a correct value. How can this be?

Regards,

Frank

If the value of the input is undefined then that means that it is getting undefined back for the href. Are the elements with the class "title" tags with an href? I would debug and ensure that $(this) is really what you think it is.

It's because it updates the DOM in the wrong way. When you use append, it'll redefine body's innerHTML, causing the DOM to generate all new elements, making your old elements undefined. Use append(element) rather than append(html).