Accessing child elements in jquery

Question

<div id="main">
 <div id="1">
   <div>contents..</div>
   <div>contents..</div>
 </div>
 <div id="2">
   <div>contents..</div>
   <div>contents..</div>
 </div>
 <div id="3">
   <div>contents..</div>
   <div>contents..</div>
 </div>
</div>

How can i access all div object into a single array who have contents in there innerHTML?

EDIT

OK I tried this :

var totaldiv = $("#main").children();
var totalElements = [];
var c = 0;
$.each(totaldiv, function (i, v) {
    $(totaldiv[i]).children().each(function () {
        totalElements[c++] = $(this);
    });
});

Is there any more efficient way to do this?

**ANY** content or exactly the string **contents..** ?? And please... what `DIV` exactly, the parent DIV or the one that holds some text? — Roko C. Buljan, Jun 01 '12 at 08:57

thecodeparadox · Accepted Answer · 2012-06-01T09:23:57.800

3

You have .filter()

var divArr = $('#main div > div').filter(function() {
    return $(this).html();  // return those div not empty, has text or html element
});

DEMO

edited Jun 01 '12 at 09:23

answered Jun 01 '12 at 08:51

thecodeparadox

86,271
21
138
164

Alnitak · Answer 2 · 2012-06-01T09:13:24.923

0

You'll probably want to exclude the higher level elements - if you use .text() on its own you'll get every element that contains text anywhere below it, not just in child nodes:

var haveContent = $('div').filter(function() {
    return $(this).children().length === 0 && $.trim($(this).text()) !== '';
}).get();

Demo at http://jsfiddle.net/alnitak/WNKLA/

edited Jun 01 '12 at 09:13

answered Jun 01 '12 at 08:54

Alnitak

334,560
70
407
495

score 0 · Answer 3 · answered Jun 01 '12 at 08:59

0

At its most basic, the following will match your example above:

$('#main div div');

Assuming there are div elements who may not have any text content, you could try this:

$('#main div div').contents().filter(function(){ return this.length > 0; })

answered Jun 01 '12 at 08:59

Phil.Wheeler

16,748
10
99
155

score 0 · Answer 4 · edited May 23 '17 at 11:49

0

You can use .contents() to access all div contents in there innerhtml..

var arry = $('div:contains(contents)');

check this link;

http://api.jquery.com/contains-selector/

And

https://developer.mozilla.org/en/nodeType

And check this one.. It is similar to your question

Jquery: Checking to see if div contains text, then action

edited May 23 '17 at 11:49

Community

1
1

answered Jun 01 '12 at 09:03

stay_hungry

1,448
1
14
21

Accessing child elements in jquery

4 Answers4