user3385136
user3385136

Reputation: 553

Jquery each function only working once

I have the following jquery function. It will only update the first row and then stops. Strangely though if i take out the line:

$("#prev_loan_approval_date").html("Not Yet Approved");

and replace it with an alert it fires off for each row. Is there any reason why this would be the case. Was thinking it mightnt return true on the next iteration because i changed the text value but this was for the previous row so the next row should still return true and change the value.

$(document).ready(function() {
    $('.loan_history_application > tbody  > tr').each(function() 
    {
        if ($("#prev_loan_approval_date").text() == "01/01/1900")
        {
            $("#prev_loan_approval_date").html("Not Yet Approved");
        };
    });

Upvotes: 0

Views: 431

Answers (4)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167172

If you have multiple items with the same ID, it doesn't work. IDs should be unique. Change them to class and change in your code:

$(".prev_loan_approval_date").html("Not Yet Approved");

Full Code:

$(document).ready(function() {
    $('.loan_history_application > tbody  > tr').each(function() {
        if ($(this).find(".prev_loan_approval_date").text() == "01/01/1900")
            $(this).find(".prev_loan_approval_date").html("Not Yet Approved");
    });
});

Upvotes: 0

Dal Hundal
Dal Hundal

Reputation: 3324

Was thinking it mightnt return true on the next iteration because i changed the text value but this was for the previous row

No, this isn't for the previous row. There's several things wrong here. Firstly the fact that you're using an ID for something that seems to occur more than once (ID's must be unique). You should use a class.

Secondly, where you're changing the text - you're not doing it just for that row. You're always doing it on every row.

$(document).ready(function() {
$('.loan_history_application > tbody  > tr').each(function() {
    if ($(".prev_loan_approval_date", this).text() == "01/01/1900")
    {
        $(".prev_loan_approval_date",this).html("Not Yet Approved");
    };
});

And in your HTML change id='prev_load_approval_date' to class='prev_loan_approval_date'

Upvotes: 0

kiko
kiko

Reputation: 72

tr has a child "#prev_loan_approval_date"? If yes, you must write

$(document).ready(function() {
    $('.loan_history_application > tbody  > tr').each(function() 
    {
        if ($(this).find("#prev_loan_approval_date").text() == "01/01/1900")
        {
            $(this).find("#prev_loan_approval_date").html("Not Yet Approved");
        };
    });

Upvotes: 2

Chrillewoodz
Chrillewoodz

Reputation: 28328

The problem is likely to be that you use an ID instead of class for $("#prev_loan_approval_date").html("Not Yet Approved"); so it will only update the first row.

Change this to:

$(".prev_loan_approval_date").html("Not Yet Approved");

And make sure you also change ID to class in your HTML.

Upvotes: 0

Related Questions