Unable to change html attribute

[davidannis]

            $(function() {
                $(".vote").click(function() 
                {
                    var id = $(this).attr("id");
                    var name = $(this).attr("name");
                    var parent = $(this);
                    if(name=='up')
                    {
                        var idtrim = id.replace('-up','');
                        var dataString = 'id='+ idtrim ;
                        var oppid = idtrim + '-down';
                        $(this).fadeIn(200).html('<img src="dot.gif" align="absmiddle">');
                        alert (dataString);
 $.ajax({
                            type: "POST",
                            dataType: "json",
                            url: "updown/up_vote.php",
                            data: dataString,
                            cache: false,
                            success: function(data)
                            {
                                parent.html(data.upvalue);
                                document.getElementById(oppid).innerHTML(data.downvalue);
                            }  });
                    }

When I execute this code I get an error:

TypeError: document.getElementById(...).innerHTML is not a function
[Break On This Error]

document.getElementById(oppid).innerHTML(data.downvalue);

I have tried setting a variable and then changing html (as in the parent.html line above my error:

var opposite = document.getElementById(oppid);
opposite.html(data.downvalue);

which gives this error:
TypeError: opposite.html is not a function
[Break On This Error]

opposite.html(data.downvalue);

What am I doing wrong?
Thanks,

[xelawho]

it's a curious mix of jQuery (I assume) and vanilla js you have there, but in vanilla you set the innerHTML like this:

document.getElementById(oppid).innerHTML=data.downvalue;

in jQuery it would be like this:

$("#"+oppid).html(data.downvalue);

you should maybe choose one or the other

the problem with your "opposite" line is that getElementById returns a DOM object but .html("something") is a jQuery method

the reason why your parent line works is because you convert "this" (whatever "this" is) to a jQuery object on this line:

var parent = $(this);

which would work equally, if you wanted to go that way by doing

var opposite = $(oppid);
opposite.html(data.downvalue);

(I think... or maybe it would be var opposite =$("#"+oppid))

Anyway. The point is you can mix jQuery and javascript (jQuery is just javascript after all) but you have to know what you're doing. Until you're confident it's best to stick to one or the other (and the general advice tends to be learn javascript basics before starting to use jQuery shortcuts)

[davidannis]

Thanks. Javascript and jQuery are next on my list of things to learn. I was going to just learn PHP but I find myself constantly stumbling through jQuery because I need Ajax to get my applications to behave the way I want them to.