Home > Net >  check if specific text exists inside li using jquery
check if specific text exists inside li using jquery

Time:07-10

I have following html that is being rendered and I would like to check if there is specific text (All documentation, requests and payments) inside the li. my html is

<div  tabindex="0" style="background-color: rgb(255, 255, 0);" 
 title="All documentation, requests and payments, Final documentation">
<ul  tabindex="-1" 
 aria-label="Selected values for Student Responsibilities" 
aria-activedescendant="value-selected-item-1">
 <li  
  name="value-selected-item-1" aria-describedby="value_selecteditems_instructions" 
  id="value-selected-item-1" 
  tabindex="-1" 
  title="" data-value="0" 
  aria-label="All documentation, requests and payments for Student Responsibilities">
 <span >All documentation, requests and payments</span>
 <button  tabindex="-1" name="value-selected-item-delete-1" aria- 
  label="Remove All documentation, requests and payments">
  <span ></span></button>
</li>
<li  name="value-selected-item-2" 
  aria-describedby="value_selecteditems_instructions" 
  id="value-selected-item-2" 
  tabindex="-1" 
  title="" 
  data-value="1" aria-label="Final documentation for Student Responsibilities">
  <span >Final documentation</span>
  <button  tabindex="-1" name="value-selected-item-delete-2" 
   aria-label="Remove Final documentation">
  <span ></span></button>
 </li>
</ul>
<div >
<button  tabindex="-1" aria-hidden="true" type="button" aria-label="Show 2 more selected items"> 2</button>
</div>
</div>

this is what I am trying to do to get it but it always returns true , which is not correct

   if($('span:contains("All documentation, requests and payments")','ul.msos-selecteditems msos-current-selection-normal').length == 0) {
    console.log('Found');
    } else {
    console.log('no Found');
    }

CodePudding user response:

You forgot a dot between the two classes: $('span:contains("All documentation, requests and payments")','ul.msos-selecteditems.msos-current-selection-normal')-

console.log('Found elements:', Array.from($('span:contains("All documentation, requests and payments")','ul.msos-selecteditems.msos-current-selection-normal')))
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div  tabindex="0" style="background-color: rgb(255, 255, 0);" 
 title="All documentation, requests and payments, Final documentation">
<ul  tabindex="-1" 
 aria-label="Selected values for Student Responsibilities" 
aria-activedescendant="value-selected-item-1">
 <li  
  name="value-selected-item-1" aria-describedby="value_selecteditems_instructions" 
  id="value-selected-item-1" 
  tabindex="-1" 
  title="" data-value="0" 
  aria-label="All documentation, requests and payments for Student Responsibilities">
 <span >All documentation, requests and payments</span>
 <button  tabindex="-1" name="value-selected-item-delete-1" aria- 
  label="Remove All documentation, requests and payments">
  <span ></span></button>
</li>
<li  name="value-selected-item-2" 
  aria-describedby="value_selecteditems_instructions" 
  id="value-selected-item-2" 
  tabindex="-1" 
  title="" 
  data-value="1" aria-label="Final documentation for Student Responsibilities">
  <span >Final documentation</span>
  <button  tabindex="-1" name="value-selected-item-delete-2" 
   aria-label="Remove Final documentation">
  <span ></span></button>
 </li>
</ul>
<div >
<button  tabindex="-1" aria-hidden="true" type="button" aria-label="Show 2 more selected items"> 2</button>
</div>
</div>

CodePudding user response:

with $('li').attr("aria-label") you can get a string with the text from aria-label, then you can see if that string contains what you want. ex:

if($('li').attr("aria-label").indexOf("All documentation, requests and payments")!=-1){
console.log('Found');
} else {
console.log('no Found');
}
  • Related