Jquery - find next element in each loop

Question

I have a question like so.

I have HTML structure:

<form id="form">
    <div class="row">
        <div class="item-input">
            <label for="A1">A1</label>
            <input type="text" name ="A1" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter A1)</span>
        </div>
        <div class="item-input">
            <label for="A2">A2</label>
            <input type="text" name ="A2" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter A2)</span>
        </div>
    </div>
    <div class="row">
        <div class="item-input">
            <label for="B1">B1</label>
            <input type="text" name ="B1" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter B1)</span>
        </div>
        <div class="item-input">
            <label for="B2">B2</label>
            <input type="text" name ="B2" />
            <span class="input-require">(*)</span>
            <span class="info">(Enter B2)</span>
        </div>
    </div>
    ...
</form>

Now I want to selected 'span' has class "info" behind input[type=text] each. I try:

<script type="text/javascript"> 
    $(document).ready(function() {
        $("#form input[type=text]").each(function(){
            var spanInfo = $(this).closest("item-input").next().find('span.info');

            console.log(spanInfo.text()); // Result is empty
        });
    });
</script>

Why is empty? Help me please. How do I, thanks

philz · Accepted Answer · 2014-11-18 02:17:01Z

1

var spanInfo = $(this).closest("item-input").next().find('span.info');

Should be

var spanInfo = $(this).closest(".item-input").next().find('span.info');

You are missing the . (dot, class)

answered Nov 18, 2014 at 2:17

philz

1,1226 silver badges11 bronze badges

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

1 Comment

Tony Nguyen Over a year ago

I was'nt careful. :) Thank you

Ryan Nghiem · Accepted Answer · 2014-11-18 02:55:13Z

0

Your mean is show "(Enter A2)" and "(Enter B2)" or show all 4 element value: (Enter A1), (Enter A2), (Enter B1), (Enter B2)

If only show 2 value then CODE HERE

else You want to show 4 value, you can code:

$(document).ready(function() {
    $("#form input[type=text]").each(function(){
        var spanInfo = $(this).closest(".item-input").find('span.info');

        console.log(spanInfo.text()); 
    });
});

answered Nov 18, 2014 at 2:55

Ryan Nghiem

2,4482 gold badges21 silver badges31 bronze badges

Collectives™ on Stack Overflow

Jquery - find next element in each loop

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related