0

I need an alternative to :contains('text') because I don't want to use jquery.

What I am trying to do is get an entire li tag to not display if the href includes a particular string of text.

li[href*="foo"] { display: none; }

In other words, If you see this...

<UL>
  <LI><A href="folder/one">one</A></LI>
  <LI><A href="folder/two">two</A></LI>
  <LI><A href="folder/three">three</A></LI>
</UL>

and i want the second one (two) to not appear, I would try...

li[href*="two"] { display: none; }

But since this is not working for me, I was wondering if anyone can help me out here.

Thanks.

user2284703
  • 357
  • 3
  • 11
  • replace `li[href*="two"]` with `a[href*="two"]` – King King Apr 24 '14 at 02:10
  • ok but I want the entire li element to not appear. Not just the a href. The li element also contains other information that I do not want. – user2284703 Apr 24 '14 at 02:12
  • looks like it's a requirement of **traverse backwards in CSS** which can't be done. You have to use script for this kind of task, in some specific cases we may have some pure CSS workaround. – King King Apr 24 '14 at 02:14
  • which brings me to why I am here. I will also accept a javascript solution. – user2284703 Apr 24 '14 at 02:16
  • It is impossible in CSS. See [this](http://stackoverflow.com/questions/2000582/css-selector-for-foo-that-contains-bar) question. – mareoraft Apr 24 '14 at 02:19
  • 1
    Honestly, I find jQuery to be so great and easier to use than pure JS. Is there a good reason not to use jQuery? – mareoraft Apr 24 '14 at 02:19
  • I'm sure that in your actual code, the `li` can have more things (than just one `a` tag), so it's very hard to have a workaround, I've just made this workaround for the exact code you posted http://jsfiddle.net/pgd8z/2/ As you can see, we can only use workaround in such a case (no other way) although I don't think workaround is recommended like this. We'd better use script instead. – King King Apr 24 '14 at 02:36

0 Answers0