9

I'm searching a solution to remove <li> tags filtered using javascript array.

Array:

var mygroups=["1","8","3","4","5"]

Example (input):

<li><div>1 element.</div></li>
<li><div>2 element. This is my <span>post</span> into new group</div></li>
<li><div>3 element. Another one</li>
<li><div>
         <a href="javascript:void(0);">Actor</a>
         <a href="/groups/viewgroup/1-first-group">First group</a>
    </div>
</li>
<li><div><a href="javascript:void(0);">Actor</a>
         <a href="/groups/viewgroup/10-ten-group">Ten group</a>5 element. This is my <span>new post</span></div></li>
<li>
   <div>6 element. <a href="/j1.5/index.php/jomsocial/63-zzz/profile">Actor</a></div>
   <div><a href="/groups/viewgroup/test/5-second-group">Group other</a></div>
</li>
<li>7 element.</li>
<li><div><a href="/groups/viewgroup/test/8-second-group">First group</a></div></li>
<li><div><a href="/groups/viewgroup/16-other-group">First group</a></div></li>
<li><div><a href="/j1.5/index.php?option=com_community&view=groups&task=viewgroup&groupid=1&Itemid=4">My other group </a></div></li>

How to get this output (Remove all instances which do not contain group in array in anchor):

<li><div>
         <a href="javascript:void(0);">Actor</a>
         <a href="/groups/viewgroup/1-first-group">First group</a>
    </div>
</li>
<li>
   <div>6 element. <a href="/j1.5/index.php/jomsocial/63-zzz/profile">Actor</a></div>
   <div><a href="/groups/viewgroup/test/5-second-group">Group other</a></div>
</li>
<li><div><a href="/groups/viewgroup/test/8-second-group">First group</a></div></li>
<li><div><a href="/j1.5/index.php?option=com_community&view=groups&task=viewgroup&groupid=4&Itemid=4">My other group </a></div></li>

This code is not working right:

    $('li').filter(function() {
    var a = $(this).find('a');
    if (!a.length)
        return true;

    var text = a.attr('href').split('/')[3];
    text = text.substring(0, text.indexOf('-'));
    if ($.inArray(text , mygroups) >= 0)
        return false;

    return true;
}).remove();

And this one does the job neither:

 $('li').filter(function() {
    if($(this).is('*:has(a[href|=/group/viewgroup/])') {
        var href = $(this).find('a').attr('href'),
            trail = href.split('/')[3],
            number = + /(\d+)-/.exec(trail)[1];
        return $.inArray(myarray, +number) == -1;
    }
    return true;
}).remove();

4 Answers 4

3

This seems to do what you want. It's not the tidiest code in the world though:

$('li').filter(function() {
    var a = $(this).find('a');
    if (!a.length)
        return true;

    var text = /(\d+)-/.exec(a.attr('href'))[1];  
    if ($.inArray(text , mygroups) >= 0)
        return false;

    return true;
}).remove();

It's getting all the li's, then filtering out any that have a matching value to the array and removing the ones that are left.

http://jsfiddle.net/8AmNR/5/

2
  • IMO, the code in the OP needs to be rethought; it would be far, far easier (and a little bit faster) to use spans with classes, or something, although the current implementation does work.
    – Bojangles
    Aug 15, 2011 at 11:19
  • Please check my details again. It can't find the second "A" tag.
    – XTRUST.ORG
    Aug 15, 2011 at 14:39
1

How about using a filter function.

In this scenario you select all the li and filter out the desired one.

$('li').filter(function(index){
    if(/*condition applied*/){
        ....
    }
});
1
  • 1
    As you're not actually filtering, you should use each here to make the code more understandable.
    – a'r
    Aug 15, 2011 at 10:55
0
$('li').filter(function() {
    if($(this).is('*:has(a[href|=/group/viewgroup/])') {
        var href = $(this).find('a').attr('href'),
            trail = href.split('/')[3],
            number = + /(\d+)-/.exec(trail)[1];
        return $.inArray(myarray, +number) == -1;
    }
    return true;
}).remove();
1
  • Please check my details again. It can't find the second "A" tag.
    – XTRUST.ORG
    Aug 15, 2011 at 14:40
0

This works

$("li").each(function() {
          if($(this).find("a").size() == 0) {
              $(this).remove();
          };
    });
2
  • The anchor has to have 'group' in the href attribute.
    – a'r
    Aug 15, 2011 at 11:00
  • This just removes all li's that don't contain an a take, the question stated that they should be filtered using the array. Aug 15, 2011 at 11:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.