CODEWITHSUNDEEP
javascriptjquery
snowflakes74
snowflakes74

Reputation: 1307

check if specific text exists inside li using jquery

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 class="msos-selecteditems-container" tabindex="0" style="background-color: rgb(255, 255, 0);" 
 title="All documentation, requests and payments, Final documentation">
<ul class="msos-selecteditems msos-current-selection-normal" tabindex="-1" 
 aria-label="Selected values for Student Responsibilities" 
aria-activedescendant="value-selected-item-1">
 <li class="msos-selected-display-item msos-visible msos-selecteditem-active" 
  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 class="msos-selected-display-item-text">All documentation, requests and payments</span>
 <button class="msos-quick-delete" tabindex="-1" name="value-selected-item-delete-1" aria- 
  label="Remove All documentation, requests and payments">
  <span class="msos-glyph"></span></button>
</li>
<li class="msos-selected-display-item msos-visible" 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 class="msos-selected-display-item-text">Final documentation</span>
  <button class="msos-quick-delete" tabindex="-1" name="value-selected-item-delete-2" 
   aria-label="Remove Final documentation">
  <span class="msos-glyph"></span></button>
 </li>
</ul>
<div class="msos-selecteditems-toggle-container">
<button class="msos-selecteditems-toggle msos-invisible" 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');
    }

Upvotes: 0

Views: 69

Answers (2)

Daniel Ferra
Daniel Ferra

Reputation: 11

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.

Example:

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

Upvotes: 1

Niklas
Niklas

Reputation: 1938

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 class="msos-selecteditems-container" tabindex="0" style="background-color: rgb(255, 255, 0);" 
 title="All documentation, requests and payments, Final documentation">
<ul class="msos-selecteditems msos-current-selection-normal" tabindex="-1" 
 aria-label="Selected values for Student Responsibilities" 
aria-activedescendant="value-selected-item-1">
 <li class="msos-selected-display-item msos-visible msos-selecteditem-active" 
  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 class="msos-selected-display-item-text">All documentation, requests and payments</span>
 <button class="msos-quick-delete" tabindex="-1" name="value-selected-item-delete-1" aria- 
  label="Remove All documentation, requests and payments">
  <span class="msos-glyph"></span></button>
</li>
<li class="msos-selected-display-item msos-visible" 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 class="msos-selected-display-item-text">Final documentation</span>
  <button class="msos-quick-delete" tabindex="-1" name="value-selected-item-delete-2" 
   aria-label="Remove Final documentation">
  <span class="msos-glyph"></span></button>
 </li>
</ul>
<div class="msos-selecteditems-toggle-container">
<button class="msos-selecteditems-toggle msos-invisible" tabindex="-1" aria-hidden="true" type="button" aria-label="Show 2 more selected items">+2</button>
</div>
</div>

Upvotes: 1

Related Questions