Question

I need to grab the text value of a child div.

<div id='first'>
    <div id='first_child'>A</div>
    <div id='second_child'>B</div>
    <div id='third_child'>C</div>
</div>

I am trying to grab the value B. I am currently trying this but it is not working,

var text_val = $('#first').next('#second_child').val();

Answer 1

You want to use children() and text() instead of val(). Although, since what you are selecting has an id (and ids must be unique), you could also simply select based on the id without involving the container element at all.

The val() method only works on input elements, textareas, and selects — basically all form elements that contain data. To get the textual contents of a container, you need to use text() (or html(), if you want the mark up as well).

var text_val = $('#second_child').text(); //preferred

or

var text_val = $('#first').children('#second_child').text(); // yours, corrected