Using jQuery selectors to find all ids that end a certain way

I am adding a row using the clone() function and then am having to rename all of the divs in the newly cloned row. I was trying to do that this way:

// Add button for new TOEFL entry
        $("#add-TOEFL").button().click(function( event ){
                event.preventDefault();

                var tag = 'TOEFL',
                    testDate = $("#TOEFLtestDate-0").val(),
                    reading = $("#readingTOEFLScore-0").val(),
                    listening = $("#listeningTOEFLScore-0").val(),
                    speaking = $("#speakingTOEFLScore-0").val(),
                    writing = $("#writingTOEFLScore-0").val(),
                    applicantId = $("#applicantId").val(),
                    dataString = 'applicantId=' + applicantId + '&dateTaken=' + testDate + '&listeningScore=' + listening + '&readingScore=' + reading + '&speakingScore=' + speaking + '&writingScore=' + writing;

                // Insert New Record
                $.ajax({
                    type: "POST",
                    url: "ajax/insertEntry.cfm?xAction=TOEFL",
                    data: dataString,
                    success: function(newIdx){

                        // Make sure returned value is a number
                        newId = jQuery.trim(newIdx) * 1;

                        // clone new row
                        newDivId = tag + '-Entry-' + newId;
                        newRow = $('#' + tag + '-Entry-0').clone().attr('id', newDivId);
                        console.log('New row cloned. DivId: ' + newDivId);

                        // get all ids
                        $("#" + newDivId).find("[@id$='-0']").each(function(){
                            selectedDivId = $(this).attr("id");
                            alert(selectedDivId);   
                        })  

                    }
                })

Here is the HTML markup:

<div id="TOEFL-Entry-0" style="display: none" >          
        <p style="margin:5px 0 0 0">
            Taken  <input name="TOEFLtestDate-0" type="text" id="TOEFLtestDate-0" class="inputDateField" style="margin-left:5px; margin-right:15px;"/>
            Reading <input name="readingTOEFLScore-0" type="text" id="readingTOEFLScore-0" class="inputTinyScoreField" style="margin:0 8px 0 5px"/>
     开发者_StackOverflow       Listening <input name="listeningTOEFLScore-0" type="text" id="listeningTOEFLScore-0" class="inputTinyScoreField" style="margin:0 8px 0 5px"/>
            Speaking <input name="speakingTOEFLScore-0" type="text" id="speakingTOEFLScore-0" class="inputTinyScoreField" style="margin:0 8px 0 5px"/>
            Writing <input name="writingTOEFLScore-0" type="text" id="writingTOEFLScore-0" class="inputTinyScoreField" style="margin:0 8px 0 5px"/>
            <button id="add-TOEFL-0">Add</button>
        </p>
    </form>
</div>

Even thought there should be a bunch of ids that match this criteria, I am not seeing the alert.

What am I doing wrong?

Josh

Update for new question code.

There are 2 problems:

1. The recently updated OP code has [@id$='-0'] -- which the original question did not. For current versions of jQuery, this should be [id$='-0'].

2. The nodes are cloned but never added to the DOM. Use something like:

   var Entry0  = $('#' + tag + '-Entry-0');
   var newRow  = Entry0.clone().attr('id', newDivId);
   //console.log ('New row cloned. DivId: ' + newDivId);
   
   Entry0.parent ().append (newRow);
   

   before trying to get the ids.

There is nothing wrong with the code you posted. The problem is in something that you haven't shown us yet.

Post your HTML and the FULL JavaScript. Ideally post a minimal, but complete, sample that duplicates the problem.

Thanks for all the help.

The problem was actually that the cloned row was not shown yet and needed to be referenced as 'newRow' instead of as $("#" + newDivId).

Once I changed that, it works like a champ.

Not quite sure why that is the case, but that makes it worse.