Selecting text inside div, why isn't .text working?

Question

In Chrome's developer console. I'm trying to grab a piece of text from a website.

Example:

<div class="someClass">This is some text!</div>

I expected this to work, but it returns 'undefined'

$('.someClass')[0].text

Yet that does work when the text is inside a tag with the same class. Is there something special occurring when the text is just inside a div? Thanks!

`$('.someClass').text()` or `$('.someClass').first().text()` or `$('.someClass:eq(0)').text()` (last two if you have more than one) — freedomn-m, Oct 18 '18 at 23:26
because [0] returns the DOM node and DOM does not have text property. — epascarello, Oct 18 '18 at 23:27
Please run a search of the archives before asking a question. Look at question https://stackoverflow.com/questions/37299313/get-inner-text-from-div for an answer to your question. — Alberto L. Bonfiglio, Oct 18 '18 at 23:49

score 1 · Answer 1 · edited Oct 18 '18 at 23:29

1

This $('.someClass')[0] returns a DOM element and not a jQuery object.

So, what you could use instead is $('.someClass')[0].textContent

edited Oct 18 '18 at 23:29

freedomn-m

27,664
8
35
57

answered Oct 18 '18 at 23:28

Ele

33,468
7
37
75

This did the trick. Thanks Ele! – jesse_2567 Oct 18 '18 at 23:30
@jesse_2567 you're welcome! – Ele Oct 18 '18 at 23:30

score 1 · Answer 2 · answered Oct 18 '18 at 23:29

1

Problem you have is you are using brackets to reference the first element. With jQuery, that returns the DOM node and DOM does not have a text property.

You need to use .eq(0) to reference jQuery and it is a method so it would need parenthesis.

console.log($('.someClass').eq(0).text())

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="someClass">This is some text!</div>

answered Oct 18 '18 at 23:29

epascarello

204,599
20
195
236

This solves my problem, AND clears up my confusion between DOM nodes and Javascript objects. Thanks epascarello! – jesse_2567 Oct 18 '18 at 23:44

score 0 · Answer 3 · answered Oct 18 '18 at 23:28

This:

$('.someClass')

...returns a jQuery selection. You can get the text from that with:

$('.someClass').text()

However, if there is more than one .someClass, you'll get the text of all of those items. That may be why you have:

$('.someClass')[0]

...but that is no-longer a jQuery selection but is a DOM element which has neither a .text() method or a .text property. There is an innerText or textContent property, neither of which has wide browser support, so maybe you're best off doing:

$('.someClass').first().text()

Selecting text inside div, why isn't .text working?

3 Answers3