Solved

How to get text contained within <li>'s using jQuery

Posted on 2013-01-14
3
2,259 Views
Last Modified: 2013-01-14
Hello,  

For the following HTML I need to get the text contained within the <li> tags.  The html is created dynamically (& are the id's, it's a Salesforce thing)  so any number of <li> tag's may exist.


<div id="j_id0:j_id24:j_id361:j_id362:j_id365"><span id="j_id0:j_id24:j_id361:j_id362:j_id366"><span id="j_id0:j_id24:j_id361:j_id362:j_id366:j_id367:j_id368:0:j_id369"><div class="message errorM3"><table border="0" cellpadding="0" cellspacing="0" class="messageTable" style="padding:0px;margin:0px;"><tbody><tr valign="top"><td><img alt="ERROR" class="msgIcon" src="/s.gif" title="ERROR"></td><td class="messageCell"><div id="j_id0:j_id24:j_id361:j_id362:j_id366:j_id367:j_id368:0:j_id369:j_id370:j_id372" class="messageText"><span id="j_id0:j_id24:j_id361:j_id362:j_id366:j_id367:j_id368:0:j_id369:j_id370:j_id373" style="color:#cc0000"><h4>Errors</h4></span><br></div></td></tr><tr><td></td><td><span id="j_id0:j_id24:j_id361:j_id362:j_id366:j_id367:j_id368:0:j_id369:j_id370:j_id382"><ul style="padding-left:10px;padding-top:0px;margin:0px"><li style="padding-top:5px">j_id0:j_id24:j_id361:j_id362:j_id393:0:j_id395:1:j_id416:j_id417:input: Validation Error: Value is required.</li><li style="padding-top:5px">j_id0:j_id24:j_id361:j_id362:j_id393:0:j_id395:2:j_id416:j_id417:input: Validation Error: Value is required.</li></ul></span></td></tr></tbody></table></div></span></span></div>


I tried the following but it just returned "Errors" and not the rest of the text.

       alert('in messageText ' + $('.messageText').text());
          $('.messageText').each(function(index) {
              alert('in test123 ' + $(this).text());
           });

Does anyone know how I can search for each text value contained within the <li> tags?

Thanks in advance.
0
Comment
Question by:speedygonzalez
3 Comments
 
LVL 9

Accepted Solution

by:
WebDevEM earned 500 total points
ID: 38774887
I think this is what you're looking for:
$('.message li').each(function (index) {
  alert('in test123 ' + $(this).text());
});

Open in new window

This is selecting all LI that are inside the <div class='message'> and alerting on the text of them.
0
 
LVL 2

Expert Comment

by:tap52384
ID: 38774904
First, let me say that I recommend that you validate your HTML. You are using some deprecated attributes, like "cellpadding" and "border" and "valign." Use CSS instead.

To get the text of each <li>, try this:

$(".messageText li").eq(index).text();

where "index" is the index of the <li> you want the text of.
0
 

Author Closing Comment

by:speedygonzalez
ID: 38776488
Thanks for the help all..
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

by Julian Matz As of jQuery (http://jquery.com/) 1.4 the .live() method (http://api.jquery.com/live/) supports custom events as well as some standard JavaScript events that it previously didn't support. Among these is the submit event. Unlike …
Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now