How to find a LI with particular content in an UL with jQuery?

jquery find all elements with class
jquery find by id
jquery find text
find text in ul li jquery
jquery find first
jquery descendant selector
jquery find string
how to check if a ul has li with jquery

In the following UL with id of CP_main_approvalist I want to find the LI that has "Awating authorisation" string and to extract that text from it:

There can be many LIs in that UL. In this case there are only two.

You can access it by: $("#CP_Main_approvalList li:contains('Awating authorisation')"),

So something like this:

$("#CP_Main_approvalList li:contains('Awating authorisation')").css('color', 'red');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul id="CP_Main_approvalList">
  <li>1. Authorised by...</li>
  <li>2. Awating authorisation from....</li>
</ul>

.find(), Given a jQuery object that represents a set of DOM elements, the .find() <ul class="level-1">. <li with the .find() method; therefore, $( "li.item-ii" ).find( "li" ) is equivalent to $( "li", var newText = $( "p" ).text().split( " " ).join( "</span> <span>" );. Having a real hard time with this since I'm new to jQuery, but I'm not sure whether the tutorial I'm working on is broken or if it's me but I'm using the following code to select all li in an ul with a class of nav.

You can try this by using children or has function like below:

$("#CP_Main_approvalList").children("li contains('Awating authorisation')").prop('innerHTML');

OR

$("#CP_Main_approvalList").has("li contains('Awating authorisation')").prop('innerHTML');

:nth-child() Selector, Given a single <ul> containing two <li> s, $( "li:nth-child(1)" ) selects the first <li> while Find the second li in each matched ul and note it. text-align: center;. Hello fellow jQuery users, I have prepared a simple jsFiddle demonstrating my 2 problems: For that I have taken the jQuery UI menu with categories example Get the value attribute of the selected LI element in jQuery UI menu - jQuery Forum

You can select the ul by using the id selector:

$("#CP_Main_approvalList")

Then, add the li and make sure it contains the text you need

li:contains('Awaiting authorisation')

And to make sure it works I changed the text color...

$("#CP_Main_approvalList li:contains('Awaiting authorisation')").css("color", "green");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul id="CP_Main_approvalList">
  <li>1. Authorised by ..... </li>
  <li>2. Awaiting authorisation from ..... </li>
</ul>

.not(), To Donate, see this list of organizations to support from Reclaim the Block Given a jQuery object that represents a set of DOM elements, the .not() method <ul>. <li>list item 1</li>. <li>list item 2</li>. <li>list item 3</li>. <li>list item 4</li> Note: When a CSS selector string is passed to .not() , text and comment nodes will  In the following UL with id of CP_main_approvalist I want to find the LI that has "Awating authorisation" string and to extract that text from it: There can be many LI s in that UL . In this case there are only two.

.parent(), Description: Get the parent of each element in the current set of matched elements, Given a jQuery object that represents a set of DOM elements, the parent() <ul class="level-1"> <li class="item-a">A</li> Attribute · Basic · Basic Filter · Child Filter · Content Filter · Form · Hierarchy · jQuery Extensions · Visibility Filter. Selector context is implemented with the .find() method; therefore, $( "li.item-ii" ).find( "li" ) is equivalent to $( "li", "li.item-ii" ). As of jQuery 1.6 , we can also filter the selection with a given jQuery collection or element.

How to check if ul has li with the given text ?, Each of the list elements of the unordered list is first selected using a jQuery selector. The each() method is used on this list to iterate through it. This method has a  li element does not have a ulelement inside it, the set returned will be empty, and size() will return 0. Hence the check if(jQuery(this).has("ul").size() > 0), which returns true if the li element has a nested ulelement, and false if not.

How to Add LI in an Existing UL using jQuery, You can simply use the jQuery append() method to add <li> elements in an existing <ul> element. The following example will add a <li> element at the end of an  Well organized and easy to understand Web building tutorials with lots of examples of how to use HTML, CSS, JavaScript, SQL, PHP, Python, Bootstrap, Java and XML.

Comments
  • Do you know beforehand what the content or part of the content of the li is that you are looking for?
  • dynamically created by server side @CarlBinalla
  • @Sitethief awating authorisation string will be there in li
  • @Roy That would target the authorized list, which is not what OP is asking for
  • Supposed that you want to get the text you can use .text()
  • how to extract the text jelena lucic which is present after from ?
  • Updated the answer.
  • @nikhiljain from what I see you are particularly reluctant to accept answers to your questions (single accepted answer since April last year). People look at your ask/check rate when they answer your questions. If it will drop any further, you might stop receiving any responses.
  • Lol, and your comment and your edits are not going to save you ;)
  • I don't care, it still a correct answer though, if you'll check my answers history you can see I don't copy answers. Keeping it live just for fun
  • Well, it's a simple question with a simple solution that hardly can be written differently...
  • @jayarjo Both are correct. "Authorisation" is mainly British and "authorization" mainly American spelling.
  • I just wanted to check your thinking behind the "typo". That's exactly what I did. So maybe the humankind is the collective hive mind after all :D