Selecting dynamically generated element in jQuery

Question

I have this code:

<c:forEach items="${ sample }" var="test">
    <tr>
        <td><strong>${ test.test }.</strong></td> // I want to get the text
        <td>
            <fieldset class="span11">
                <div class="control-group">
                    <label class="control-label"><strong>${ test.blah }</strong></label>
                    <div class="controls" id="question${ test.blah }">
                        <c:forEach var="beng" items="${ anotherSample }">
                            <form:radiobutton path="boom" class="question-choices" data-label="${ choices }" value="${ beng-boom }"/><br>
                        </c:forEach>
                    </div>
                </div>
            </fieldset>                 
        </td>
    </tr>
</c:forEach>

I want to get the text from the first <td> from the radio button:

What I tried so far is:

$('.question-choices').on('change', function() {
    console.log( $(this).parent('tr').closest('td').text() );
});

But this returns empty string

Because the parent is a div, not a tr. Read the docs for more information. api.jquery.com/parent — epascarello
– epascarello, Commented Nov 25, 2013 at 14:42
@epascarello parents('tr') seems to do what OP wants. Could be a typo. — Evan Davis
– Evan Davis, Commented Nov 25, 2013 at 14:47

Alessandro Minoccheri · Accepted Answer · 2013-11-25 14:46:53Z

2

try this;

$('.question-choices').on('change', function() {
    console.log( $(this).closest('tr').find('td:first').find("strong").html() );
});

edited Nov 25, 2013 at 14:46

answered Nov 25, 2013 at 14:39

Alessandro Minoccheri

36.1k22 gold badges128 silver badges176 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

newbie Over a year ago

I want the readability of this but this also includes the <strong> tag

newbie Over a year ago

Is there a reason why did you use .find("strong").html() instead of .text()?

Alessandro Minoccheri Over a year ago

I prefer to use html() in this case to get all content @newbie

qwertynl · Accepted Answer · 2013-11-25 14:39:24Z

1

parent() only gets a direct parent.

Try using .parents:

$('.question-choices').on('change', function() {
    console.log( $(this).parents('tr').closest('td').text() );
});

answered Nov 25, 2013 at 14:39

qwertynl

3,9331 gold badge24 silver badges43 bronze badges

1 Comment

epascarello Over a year ago

parents() would give you multiple elements if nested tables. This is also broken because .closest('td') would be looking at the TR's parents!

Collectives™ on Stack Overflow

Selecting dynamically generated element in jQuery

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related