Append numeric value to input name attribute with jQuery

Question

I'm trying to add _1, _2 etc to the end of my input elements in a dynamic form. The user can add as many as they want I wrote this method but it seems to throw errors saying the "dName is undefined"

$j("#addBranch").click(
                    function()
                        {
                            //see withDataAndEvents, copies events with bool in clone method
                            $j('.branchOffice').first().clone(true).appendTo('#branchOffice');
                            $j('.branchOffice').last().children().attr('name',function()
                            {
                                var dName = $j(this.name).attr('name');
                                    return dName.substring(0, dName.length-1) + ($j('.branchOffice').size() + 1)
                                });    
                        }
                    );

Here is the HTML

<div class="leftPane">
        <label for="company_name">Company Name</label>
        <input class="req"  type="text" name="company_name" id="company_name" />
        <label for="branch_office">Home Office</label>
        <input class="req" type="text" name="branch_office_1" id="branch_office_1" />
        <label for="branch_office_add1_1">Address</label>
        <input class="req" type="text" name="branch_office_add1_1" id="branch_office_add1_1" />
        <label for="branch_office_add2_1">Address 2</label>
        <input type="text" name="branch_office_add2_1" id="branch_office_add2_1" />
        <label for="branch_office_city_1">City</label>
        <input class="req" type="text" name="branch_office_city_1" id="branch_office_city_1" />
        <label for="branch_office_state_1">State</label>
        <select id="branch_office_state_1" name="branch_office_state_1">
            <?php echo $formHelper->stateList; ?>
        </select>
        <label class="naked" for="branch_office_zip_1">Zip</label>
        <input class="req zip"  type="text" name="branch_office_zip_1" id="branch_office_zip_1" />
    </div>
    <div class="rightPane" id="branchOffice">
        <div class="branchOffice">
            <label for="branch_office_2">Branch Office</label>
            <input class="req" type="text" name="branch_office_2" id="branch_office_2" />
            <label for="branch_office_add1_2">Address</label>
            <input class="req" type="text" name="branch_office_add1_2" id="branch_office_add1_2" />
            <label for="branch_office_add2_2">Address 2</label>
            <input type="text" name="branch_office_add2_2" id="branch_office_add2_2" />
            <label for="branch_office_city_2">City</label>
            <input class="req" type="text" name="branch_office_city_2" id="branch_office_city_2" />
            <label for="branch_office_state_2">State</label>
            <select id="branch_office_state_2" name="branch_office_state_2">
                <?php echo $formHelper->stateList; ?>
            </select>
            <label for="branch_office_zip_2">Zip</label>
            <input class="req zip"  type="text" name="branch_office_zip_2" id="branch_office_zip_2" />
        </div>
    </div>
    <div class="spacer"></div>
    <small class="red">If more than one branch office, please</small><a class="addMore" title="Add Branch" id="addBranch">Add More</a>

Answer 1

var dName = $j(this).attr('name');

or, now that i look again, $j(this) referes to .branhOffice and not #addBranch.

maybe set a val;

var addBranch = $(this);

then your other selects then

var dName = $(addBranch).attr('name');