How to stop receiving: TypeError: $ (...). Attr (...) - undefined?

Question

I am using jQuery 1.7.0 and I keep getting TypeError: $ (...). attr (...) is undefined. Can someone please tell me what is the problem? My jQuery is below. Thanks.

function removeNewItem() { $('.aboutitemdelete').unbind('click'); $('.aboutitemdelete').on('click', function () { // Get Related Object var current = $(this).attr('rel').replace('aboutitemremove_', ''); // Removing Element $('#aboutitem_' + current).remove(); //Assign Current Element Count answercount = parseInt($('#answercount').val()); answercount -= (answercount > 1) ? 1 : 0; $('#answercount').val(answercount); }); }; $(document).ready(function () { $('.button_admin_newitem').on('click', function () { alert('a'); current = $('.aboutsectionitem:last').attr('id').replace('aboutitem_', ''); current = Number(++current); alert('b'); $('div.aboutitemsholder').append('<div id="aboutitem_' + current + '" class="aboutsectionitem"><h4 class="titlebar_span">About Page Item</h4><div class="aboutrow_sep"><label>Section Label</label><input id="seclabel_' + current + '" type="text" class="text" /><div class="clear"></div></div><div class="aboutrow_sep"><label>Section Content</label><div class="aboutrow_editor_holder">Telerik Editor Goes Here<div class="clear"></div></div><div class="clear"></div></div><div class="aboutrow_sep"><label>Enabled?</label><input id="itemenable_' + current + '" type="checkbox" class="checkbox" /><div class="clear"></div></div><div class="aboutrow_sep"><label>Sort Order</label><input id="sortitem_' + current + '" type="text" class="text" style="max-width: 50px;" /><div class="clear"></div></div><div class="clear"></div><div class="aboutitemremove"><label>Delete</label><a href="#" class="aboutitemdelete" rel="aboutitemremove_' + current + '"><span>Remove</span></a></div></div>'); answercount = parseInt($('#answercount').val()) + 1; $('#answercount').val(answercount); removeNewItem(); return false; }); }); 

Answer 1

http://api.jquery.com/attr/

As in jQuery 1.6, the .attr () method returns undefined for attributes that have not been set.

I assume that the attribute you are looking for is not set in the element you are looking for. Because of this, .replace does not work because undefined does not have a replacement method. First you need to make sure that it is not undefined.

 var current = $(this).attr('rel'); current = current ? current.replace('aboutitemremove_', '') : ''; 

do this for id in the next area.