jQuery: list appended not displaying bullets
        Posted  
        
            by Shizhidi
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by Shizhidi
        
        
        
        Published on 2010-04-27T08:41:27Z
        Indexed on 
            2010/04/27
            8:43 UTC
        
        
        Read the original article
        Hit count: 397
        
I have the following html:
<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <span>not so important</span>
  <span title="some specific text"><img src="/img/some.gif" /></span>
  <span title="more specific text">important 1</span>
  <span title="more specific text">important 2</span>
  <span title="more specific text">important 3</span>
  <span title="more specific text"><img src="/img/some.gif" /></span>
  <ul>
    <li>example 1</li>
    <li>example 2</li>
    <li>example 3</li>
  <ul>
  <script>
    var ul = $('body').append($('<ul>'));
    $("span[title*='specific text']")
        .contents()
        .filter(function(){ return $(this).nodeType != 1; })
        .each(function(){
            ul.append($('<li>' + $(this).text() + '</li>'));
        })
  </script>
</body>
</html>
I want to retrieve the text within a 'span' whose title attribute contains "specific text", in this case "important 1", "important 2" and "important 3". Then I want to list them below just like the example. However the bullets do not appear, why is that? Any hints would be appreciated!
© Stack Overflow or respective owner