CODEWITHSUNDEEP
jqueryundefinedattr
Shyantanu
Shyantanu

Reputation: 681

jQuery .attr() method returning undefined

<ul id="footernav">
    <li><a href="javascript:void(0);" id="chat" data-icon="custom" data-transition="none">Tools</a></li>
    <li><a href="javascript:void(0);" id="email" data-icon="custom" data-transition="none">My Ride</a></li>
    <li><a href="javascript:void(0);" id="login" data-icon="custom" data-transition="none">News</a></li>
    <li><a href="javascript:void(0);" id="skull" data-icon="custom" data-transition="none">Cool</a></li>
    <li><a href="javascript:void(0);" id="coffee" data-icon="custom" data-transition="none" class"ui-btn-active ui-state-persist">Contact</a></li>
</ul>

Now I am using this jQuery function to get the id of the li which I have clicked:

$('#footernav li').click(function(){                     
    alert($(this).attr('id'));                    
});

But it returns undefined.

Upvotes: 5

Views: 38858

Answers (3)

rajesh kakawat
rajesh kakawat

Reputation: 10906

This will help you out

$('#footernav li').click(function(){                     
     alert($('a',this).attr('id'));                    
});

Upvotes: 5

zerkms
zerkms

Reputation: 255115

That's because your li don't have IDs

Use this selector instead: $('#footernav li a')

Upvotes: 13

mas-designs
mas-designs

Reputation: 7556

Because you are on the li element not on the a tag.

You should listen to 

$('#footernav li a').click(function(){
     alert($(this).attr('id'));

});

Upvotes: 6

Related Questions