javascript - Change ID of an element where Class is X -

i'm trying change id of div via ajax.
because id has dynamic value added class div.

my php code:

    echo '<div id="pagemenu">             <ul id="tabpanel">'; $tel = 0; while($totaalklanten > -4) {     $tel++;     echo '<li><a href="#'.$tel.'" name="'.$tel.'" onclick="listklant(\'klant.php\',this.name)">'.$tel.'</a></li>';     $totaalklanten = $totaalklanten - 5; } echo '</ul>'; echo '<div class="changeme" id="default">'; //lots of query of php stuff here execute echo '</div> 

the div class 'changeme' victim.

my ajax code far:

xmlhttp = new xmlhttprequest();  function listklant(serverpage, pagenum) {     xmlhttp.open("get", serverpage);        document.getelementsbyclassname('changeme').id = pagenum;     alert(document.getelementbyid(pagenum));     alert(document.getelementsbyclassname('changeme').id);       xmlhttp.onreadystatechange = function()     {         if (xmlhttp.readystate == 4 && xmlhttp.status == 200)         {             obj.innerhtml = xmlhttp.responsetext;         }     }     xmlhttp.send(null); } 

the first alert gives me 'null' :(...
yet second alert gives me right value, 'pagenum' applied succesfully.
doing wrong? , how fix it?
(if there else can improve, please give shout)

document.getelementsbyclassname('changeme').id = pagenum; 

this line of code not set id of elements class changeme. getelementsbyclassname returns nodelist containing elements. setting id property on nodelist. obviously, not reflected on elements within list.

to this, work on elements themselves. if have 1 element class, simple:

document.getelementsbyclassname('changeme')[0].id = pagenum; 

if have more elements, you'll need loop:

var els = document.getelementsbyclassname('changeme'); (var = 0; < els.length; i++ ) {     els[i].id = pagenum; } 

however, it's bad idea change element's id. using class might better idea here.

---

edit explain why second alert works, because same nodelist returned call getelementsbyclassname. the spec:

when method [getelementsbyclassname] invoked on htmlelement object again same argument, user agent may return same object object returned earlier call.