Question

This is my HTML code :

<div class="span4">
<div class="hero-unit" style="padding:10px 10px 10px 10px">
    <div class="accordion" id="accordion2">
        <div class="accordion-group">
            <div class="accordion-heading">
                <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
                North Delhi
                </a>
            </div>
            <div style="height: 0px;" id="collapseOne" class="accordion-body collapse">
                <div class="accordion-inner">
                    <ol>
                        <li><a id='link' href="#" name="Some name1 ">Some link1</a> </li>
                        <li><a id='link' href="#" name="Some name2">Some link2</a> </li>
                    </ol>
                </div>
            </div>
        </div>
    </div>

and this is my jQuery code

$(document).ready(function() {
    $('#link').click(function() {
        var n = $(this).attr(name); //alerts undefined
        alert(n);
        $('#results').html(' ').load('/donate/?n=' + n);
    });
});

My HTML code has several accordion-inner divs with multiple links. I want to get the name attribute of the clicked link. This code alerts me undefined check my jQuery code and please tell me what am i doing wrong?

I am new to jquery so please help.

Answer 1

The problem is that you are not putting name in quotes, so Javascript looks for a variable named name and doesn’t find one. You should change that to:

var n = $(this).attr("name");

Apart from that, your ids are not unique. This is illegal and practically guaranteed to give you problems in the future. Follow the suggestion of @nbrooks and change the overused id to a class.