SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    search child nodes and hide certain nodes

    I've got some dynamic content coming into my page, and I need to be able to search the content and hide certain elements.

    Sample HTML:

    Code:
    <div id="container">
      <ul>
         <li class="item">Superman is faster than a speeding bullet</li>
         <li class="item">Lex Luthor is balder than Mr. Clean</li>
      </ul>
    </div>
    Basically, I want to hide any LI's that contain "Lex Luthor". Hiding the element isn't the problem -- finding the elements that contain the string is.

    How can I go about doing that? Ultimately, I want it to show only "Superman" LI's and not "Lex Luthor" ones.

    Make sense?

    Any help would be appreciated. I've spent four hours looking for a way to do this and tried a dozen possibilities, but none of them have worked.

    Thanks!

  2. #2
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jsucamel View Post
    Basically, I want to hide any LI's that contain "Lex Luthor". Hiding the element isn't the problem -- finding the elements that contain the string is.
    This assumes that the LIs just contain text:
    Code:
    <script type='text/javascript'>
    
    var listItems=document.getElementById("container").getElementsByTagName('li');
    
    for(var i=0;i<listItems.length;i++)
     if(listItems[i].firstChild.nodeValue.match(/lex\s+luthor/i))
      listItems[i].style.display='none';
    
    </script>
    Tab-indentation is a crime against humanity.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •