jQuery获取子DIV的HTML内容

Question

Not sure why I cannot get this to work. Tried a few permutations now.

I have built a JSFIDDLE here .

I cannot get this jQuery to return the inner HTML for the target element. Is it because of the number child elements in the hierarchy?

jQuery:

modalContentLeft  = 'Project: ' + $('#mob-' + uuid + ' div.project-name').html();

I have also tried using .find() without success. Thanks for any help.

Answer 1

I found your fault: you are closing the div tag of the id before it gets to the name. You are closing it before the class <div class="mobile-item-row clearfix"> , so the selector does not find the children ".project-name" in it,because there is none. if you remove the closing tag and close it at the end of the HTML and change the syntax of the selector a bit, it works.

Project: ' + $('#mob-'+uuid+' .project-name').html()

Here you go: https://jsfiddle.net/ucupbtsf/5/

Answer 2

First your post here and your jsfiddle don't reflect the same...

JsFiddle :

modalContentLeft = 'Project: ' + $('#mob-' + uuid + ' div div  .project-name').html()...

Here :

modalContentLeft  = 'Project: ' + $('#mob-' + uuid + ' div.project-name').html();

Then, your html is :

<div class="mobile-item-row-first first-row clearfix" id="mob-6c985947-c68a-4f5b-9ebe-0d488b696f0d">
  <div class="project-client pull-left">
    <i class="ion-ios-people ion-fw" data-original-title="" title=""></i>&nbsp; Sienna Cremin
  </div>
</div>

which does not reflect your jquery selector :

$('#mob-' + uuid + ' div div  .project-name').html()

Seems you closed too much div, so your .project-name div is not in the #mob-id div.

$(elem).html() will get you all the content of the div (including the <i></i> part). If you only want the text, you can go for $(elem).text() .