CODEWITHSUNDEEP
jqueryjquery-selectors
MAX POWER
MAX POWER

Reputation: 5448

jQuery children selector

I have the following markup:

<div class="form-fields">
  <div class="row">
    <span class="info">Info</span>
  </div>
</div>

Using the children selector how can I select span.info? I have tried doing:

$('.form-fields').children('.row .info')

But this didn't work for me.

EDIT: Thanks for the answers everyone. If I assign the container DIV as follows:

var parentDiv = $('.form-fields')

Then using the var 'parentDiv' what is the best way to select span.info?

Upvotes: 4

Views: 5808

Answers (4)

riffnl
riffnl

Reputation: 3183

$('.form-fields').children('.row').children('.info')

you can test it like:

$(document).ready(function() {
    alert( $('.form-fields').children('.row').children('.info').length);


});

Upvotes: 0

jAndy
jAndy

Reputation: 236022

.children() will only grab immediate child nodes. You need to invoke .find().

$('.form-fields').find('.row .info')

or even

$('.form-fields').find('.row').find('.info');

just by selector

$('.form-fields .info')

Reference: .children(), .find()

Upvotes: 2

lonesomeday
lonesomeday

Reputation: 237865

Use find to get non-direct descendants:

$('.form-fields').find('.row .info')

Upvotes: 9

SilentGhost
SilentGhost

Reputation: 319601

Why do you need to use .children?

$('.form-fields span.info')

Upvotes: 2

Related Questions