Javascript - manipulating and using this variable

Question

I am trying use this function that changes the class and onclick of another element.

partner = this.id + 'Content';

            document.getElementById(partner).className = 'newswrapper';
            document.getElementById(partner).onclick = function(){ clickNews(this); } ;

the id of the element with the onclick looks like this.

echo'<div id="newsSlide'.$counter.'" class="newsimage" 
            onclick="clickNews(this)" 
            style='."'".'background-image:url("../img/'.$row['image'].'")'".'>';

and the element that is supposed to have its class changed looks like this

echo'<div id="newsSlide'.$counter.'Content" class="newswrapper">';

getting the error Uncaught TypeError: Cannot set property 'className' of null

echo'<script>';
        echo"function clickNews(id)
        {
            var y = document.getElementsByClassName('newswrapper');
            var x = document.getElementsByClassName('newswrapper2');

            var length = y.length,
            element = null;
            for (var i = 0; i < length; i++) {
              element = y[i];
              element.className = 'newswrapper2';
            }

            var length = x.length,
            element = null;
            for (var i = 0; i < length; i++) {
              element = x[i];
              element.className = 'newswrapper2';
            }

            partner = this.id + 'Content';

            document.getElementById(partner).className = 'newswrapper';
            document.getElementById(partner).onclick = function(){ clickNews(this); } ;

        }";
        echo'</script>';

the html can be found here : http://pastebin.com/6xBNBQwZ or you can use the HTML inspector on the actual page here here : http://www.uk-sf.com/indextest.php

Niet the Dark Absol · Accepted Answer · 2014-04-29 08:37:00Z

5

You're missing document.:

document.getElementById(partner).className = 'newswrapper';

getElementById is a method of the document, not the window ;)

answered Apr 29, 2014 at 8:37

Niet the Dark Absol

326k86 gold badges480 silver badges604 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

user3211248 Over a year ago

uk-sf.com/indextest.php Here is where I am testing the function, it isn't working still.

user3211248 Over a year ago

getting the error Uncaught TypeError: Cannot set property 'className' of null

Niet the Dark Absol Over a year ago

All of them work except the last one. This suggests that the last one does not have a corresponding element.

Łukasz Szewczak · Accepted Answer · 2014-04-29 09:06:43Z

0

Your this.id in partner = this.id + 'Content' is refer to global variable id on window object not the id to your element, and becouse ther is not global variable the partner variable looks like that undefinedContent

So change onclick="clickNews(this.id)" and than use id from arguments

function clickNews(id) 
    {
        partner = id + 'Content'; // use id form arguments
    }

And fiddle with simple example

edited Apr 29, 2014 at 9:06

answered Apr 29, 2014 at 9:01

Łukasz Szewczak

1,8911 gold badge13 silver badges14 bronze badges

3 Comments

user3211248 Over a year ago

solutions? change the onclick to onclick="clickNews(this.id)". And then adapt the function to use the id????????

user3211248 Over a year ago

sorry could you present me more of a solution, I have been ironing out my PHP ability but I still really am learning with the javascript

Łukasz Szewczak Over a year ago

I put a fiddle with simple example

Collectives™ on Stack Overflow

Javascript - manipulating and using this variable

2 Answers 2

3 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related