Changing Parent Class

Question

I am having a problem with my javascript that I can't quite explain. Here is the html:

<body>
<div id='slidecarousel' class='slide1' onclick='No functions can be here'>
<div id="sliderButton" onclick='pageSlider(this)'>Next Slide</div>
<div id='piece of slider...'></div>
<div...></div>
...
</div>
</body>

Here is the javascript and the error:

function pageSlider(elem)
{
    var pDiv = $(elem).parent('#slidecarousel')
    if ( pDiv.className.match(/(?:^|\s)slide1(?!\S)/) ){

**Uncaught TypeError: cannot call method 'match' of undefined**

         pDiv.className = "slide2";
    } else {
    pDiv.className = "SlideErr";
}
}

`pDiv` is a jQuery object, `className` is a property of DOM elements. — Barmar, Jan 12 '14 at 03:37
Please this check this http://stackoverflow.com/questions/195951/change-an-elements-css-class-with-javascript — Kamlesh, Jan 12 '14 at 03:41

jfriend00 · Accepted Answer · 2014-01-12T04:01:06.173

1

pDiv is a jQuery object, NOT a DOM element so it doesn't have a className property. You can get the first DOM element with:

pDiv[0]

So, just change this:

var pDiv = $(elem).parent('#slidecarousel')

to this:

var pDiv = $(elem).parent('#slidecarousel')[0];

As an additional change, this doesn't make a whole lot of sense:

var pDiv = $(elem).parent('#slidecarousel')

If you just want the #slidecarousel object, then just use:

var pDiv = $('#slidecarousel')[0];

because there can only be one #slidecarousel object in the whole page anyway.

Or, if you just want the parent of elem, then use this:

var pDiv = elem.parentNode;

Or, you could also use .closest() like this:

var pDiv = $(elem).closet(".slide1")[0];

edited Jan 12 '14 at 04:01

answered Jan 12 '14 at 03:38

jfriend00

683,504
96
985
979

why not `var pDiv = $('#slidecarousel')` – Arun P Johny Jan 12 '14 at 03:41
1

@ArunPJohny - I don't really understand what the OP is trying to do with `$(elem).parent('#slidecarousel')`. The point of the answer is that they need to use `[0]` to get the DOM object before accessing `.className`. – jfriend00 Jan 12 '14 at 03:58

score 1 · Answer 2 · answered Jan 12 '14 at 03:39

1

Use jQuery's method for testing classes:

if (pDiv.hasClass("class1"))

answered Jan 12 '14 at 03:39

Barmar

741,623
53
500
612

score 0 · Answer 3 · answered Jan 12 '14 at 03:38

0

You should do:

pDiv[0].className.match(

or

pDiv.attr("class").match(

Cheers

answered Jan 12 '14 at 03:38

Edgar Villegas Alvarado

18,204
2
42
61

Changing Parent Class

3 Answers3