Search code examples
jqueryfindchildren

jquery find div within nested div containers


I am trying to get the text or html of a div container that is nested within another div container. jquery code returns undefined. JSFiddle

HTML

<div class="todo-task ui-draggable-handle ui-sortable-handle" id="29,Action" style="position: relative;">
  <div class="task-header">
     <div class="task-no">29</div>
     <div class="task-type">Action</div>
  </div>
  <div class="task-body">
     <div class="task-title">Review the detailed project management plan</div>
  </div>
  <div class="task-footer">
     <div class="task-date"><i class="material-icons" style="font-size:12px">access_time</i>&nbsp;Jun 20</div>
     <div class="task-Username">GV</div>
  </div>

Here is the jquery code I am trying

var html = $('#29,Action').children().find('.task-body').html();
console.log(html);

Any help appreciated.


Solution

  • The issue is with your id names. You cannot begin with a number, or use a comma. see the rules here. use id='Action-27' , then:

     var html = $('#Action-27').find('.task-body').html();
    

    working fiddle