Как получить содержимое тега H3 из LI

Question

У меня есть список, содержащий кучу li. Мне нужно пройти через эти li и получить текст внутри h3, где он говорит об Сообществе в следующем html.

Например, я могу петлю через Ли, как так:

$('#subpanel_list li').each(function(){ 
    console.log($(this).closest('div').children('table').children('h3').html()); 
}); 

Но я не могу получить значение Community. Как получить это значение из следующего беспорядка html, который находится внутри li с использованием jQuery?

<li class="noBullet" id="whole_subpanel_accounts_accounts_1"> 
    <div id="subpanel_title_accounts_accounts_1" onmouseover="this.style.cursor = 'move';" style="cursor: move;"> 
     <table width="100%" cellpadding="0" cellspacing="0" border="0" class="formHeader h3Row"> 
      <tbody> 
       <tr> 
        <td nowrap=""> 
         <h3> 
          <span> 
           <a name="accounts_accounts_1"/> 
            <span id="show_link_accounts_accounts_1" style="display: none;"> 
             <span id="hide_link_accounts_accounts_1" style=""> 
              Community 
             </span> 
         </h3> 
        </td> 
        <td width="100%"> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
    <div cookie_name="accounts_accounts_1_v" id="subpanel_accounts_accounts_1" style=""> 
</li> 

Answer 1

Если вы просто хотите текст, чем использовать text() и не html(). H3 является потомком li, поэтому использование ближайшего неправильное. Closest идет в противоположном направлении, поэтому вы смотрите на предков. Вам нужно использовать find().

$(this).find("h3").text() 

Answer 2

find(), а не closest(), и вы можете упростить ваш прикован children():

$(this).find('div > table h3').html() 

Answer 3

closest() идет вверх по дереву DOM, в то время как вы, кажется, хотят идти по ней. Попробуйте использовать find() вместо:

$('#subpanel_list li').each(function(){ 
    console.log($(this).find('div').children('table').children('h3').html()); 
}); 

Обратите внимание, что вы можете сократить этот селектор в одном find():

$(this).find('div table h3').html() 

Вы также можете быть лучше, используя text() метод вместо html(), как вы утверждаете, что вы только хотите значение Community, а не кодированный HTML.

Наконец, у вас появилось несколько незакрытых элементов HTML, хотя я предполагаю, что это просто проблема при расшифровке примера для вопроса.