How do I stop receiving: TypeError: $(...).attr(...) is undefined?

Question

I'm using jQuery 1.7.0, and I keep getting TypeError: $(...).attr(...) is undefined. Can someone please tell me what the problem is? My jQuery is below. Thank you.

    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 of jQuery 1.6, the .attr() method returns undefined for attributes that have not been set.

My guess is the attribute you are searching for isn't set on the element you're searching for it on. Due to this, .replace is failing because undefined doesn't have a replace method. You'll need to make sure it isn't undefined first.

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

do this for the id in the next area too.