Скрыть элемент li, если контент соответствует другому div

Question

В настоящее время у меня есть контент внутри div «company-name», у меня также есть целый список элементов, у которого есть div «item-name». Если содержимое внутри «item-name» соответствует содержимому внутри «company-name» (WORD FOR WORD), тогда я хочу отобразить: block; что li, иначе li должно быть СКРЫТЬ.

Также, если div «item-name» пуст/пуст, он также должен быть скрыт.

<div id="company-name">ABC Corporation</div> 

<ul> 

<li>Content for this item - this list item should display:block; because the item-name matches the company-name 
    <ul> 
     <li class="location">Australia</li> 
     <li class="industry">Pharmaceuticals</li> 
     <li class="item-name">ABC Corporation</li> 
    </ul> 
</li> 

<li>Content for this item - this list item should be HIDDEN - display:block; 
    <ul> 
     <li class="location">Australia</li> 
     <li class="industry">Pharmaceuticals</li> 
     <li class="item-name">XYZ Company</li> 
    </ul> 
</li> 

<li>Content for this item - this list item should be HIDDEN - display:block; 
    <ul> 
     <li class="location">Australia</li> 
     <li class="industry">Pharmaceuticals</li> 
     <li class="item-name">LMN Hardware</li> 
    </ul> 
</li> 

</ul> 

Answer 1

Вы можете перебирать item-name элементы и посмотреть, будет ли соответствие его содержание, в company-name, если так показать, как

var cn = $('#company-name').text().trim(); 
 
$('li:has(li.item-name)').hide(); 
 
$('li.item-name').filter(function() { 
 
    return $(this).text().trim() == cn; 
 
}).parent().closest('li').show()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="company-name">ABC Corporation</div> 
 

 
<ul> 
 

 
    <li>Content for this item - this list item should display:block; because the item-name matches the company-name 
 
    <ul> 
 
     <li class="location">Australia</li> 
 
     <li class="industry">Pharmaceuticals</li> 
 
     <li class="item-name">ABC Corporation</li> 
 
    </ul> 
 
    </li> 
 

 
    <li>Content for this item - this list item should be HIDDEN - display:block; 
 
    <ul> 
 
     <li class="location">Australia</li> 
 
     <li class="industry">Pharmaceuticals</li> 
 
     <li class="item-name">XYZ Company</li> 
 
    </ul> 
 
    </li> 
 

 
    <li>Content for this item - this list item should be HIDDEN - display:block; 
 
    <ul> 
 
     <li class="location">Australia</li> 
 
     <li class="industry">Pharmaceuticals</li> 
 
     <li class="item-name">LMN Hardware</li> 
 
    </ul> 
 
    </li> 
 

 
</ul>