Trying to add a class to element if URL contains X

Question

Trying to get to work this bit of a code

<script type="text/javascript">
$(function (){
    if ( document.location.href.indexOf('product') > -1){
    $('.featproducts').addClass("display-none")
}
});
</script>

The URL is: http://domsveta.by/katalog/product/3919-

Here's some test fiddle http://jsfiddle.net/83H63/5/

I'm afraid it's in Russian so it's gonna create some complecations in understanding.

Any idea why it doesn't work? Thanks

I want to assign a class .display-none to any the element of class "featproducts" if it is shown on the page with "product" in the URL

UPDATE

In the fiddle http://jsfiddle.net/83H63/5/ Using the # I was able to add a class to an element

However on the production site I wasn't able to do it using either # or .featproducts

So it's not the code that's faily.

Thank you for your heads up.

can we see the edited code in your question? and can you also paste the page URL or something similar? I am nearly sure that the issue is with your IF cond. — lshettyl, Mar 22 '14 at 17:02
@LShetty I've just edited the question. Added a dot before in the ``'featproducts'`` selector so it's now ``'.featproducts'``. Nothing changed. The URL is http://domain.com/katalog/product/XXXX where XXXX is the ID of the product. — cameraobscura, Mar 22 '14 at 17:08
and if you do alert($('.featproducts').length) just before the if conditon, what do you get? — lshettyl, Mar 22 '14 at 17:11
@LShetty created a small fiddle http://jsfiddle.net/83H63/2/ — cameraobscura, Mar 22 '14 at 17:13
@goodknight: your code actually works, check: http://jsfiddle.net/83H63/6/ (I've changed "product" to "_display" as this is part of the url of the jsfiddle — Vickel, Mar 22 '14 at 17:34

score 0 · Answer 1 · answered Mar 22 '14 at 16:53

0

class selector .

$('.featproducts').addClass("display-none");
// ^

answered Mar 22 '14 at 16:53

Tushar Gupta - curioustushar

58,085
24
103
107

Edited the code still not working. No error in the console is shown. – cameraobscura Mar 22 '14 at 16:55
``.display-none{ display: none; ``} – cameraobscura Mar 22 '14 at 17:00
@TusharGupta the console prints "null". – cameraobscura Mar 22 '14 at 17:06
@TusharGupta but there is. At least the source code says so. – cameraobscura Mar 22 '14 at 17:19
then why does console log says null ?? – Tushar Gupta - curioustushar Mar 22 '14 at 17:19
@goodknight: do you call jquery? because in the fiddle you didn't – Vickel Mar 22 '14 at 17:19
@Vickel yes I do on the production site of course. I didnt do that in the fiddle since the code is not supposed to work there as it will have nothing to do with the URL provided. – cameraobscura Mar 22 '14 at 17:22

score 0 · Answer 2 · answered Mar 22 '14 at 16:54

0

You need to use . to target class in jQuery, so you can do:

$('.featproducts').addClass("display-none");

answered Mar 22 '14 at 16:54

Felix

37,892
8
43
55

score 0 · Answer 3 · answered Mar 22 '14 at 17:24

0

Gosh! how could I not see it...

Demo: JSFiddle Ignore the alert, hit "run"

it has to be:

window.location.href


if ( window.location.href.indexOf('product') > -1){
    $('.featproducts').addClass("display-none")
}

answered Mar 22 '14 at 17:24

lshettyl

8,166
4
25
31

1

According to the W3C, they are the same. In reality, for cross browser safety, you should use window.location rather than document.location see:http://stackoverflow.com/questions/2430936/whats-the-difference-between-window-location-and-document-location-in-javascrip – Vickel Mar 22 '14 at 17:29

Trying to add a class to element if URL contains X

3 Answers3