Dynamically set the id for div in javascript

Hi,
I'm trying to for a div in my page in a javascript in clicking a link. So i need to set the id for the div and id for other contents inside the div based on the link clicked. I'm able to take the id of the link. Now i need to form the ids in the javascript based on the obtained id. But when i try to access the id it says it as a [object]. How can i do this. I've given the code of the js here, can someone help me on this.

Code:

---

var serviceID = this.id ;
var contentDivName = 'div_' + serviceID + '_Content' ;
this.innerHTML = "<div id='div' + serviceID + 'Main' style='BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #b9c9ef 1px solid; Z-INDEX: 9999; BACKGROUND: #e0e9f8; LEFT: 0px; BORDER-LEFT: #b9c9ef 1px solid; WIDTH: 250px; BOTTOM: 0px; BORDER-BOTTOM: #455690 1px solid;' >" +
"<div class='handle' + serviceID + '' id='div' + serviceID + 'Title' style='FONT: 12px arial,sans-serif; WIDTH: 250px; HEIGHT:25px;CURSOR: move; COLOR: #1f336b; TEXT-DECORATION: none' >" +
"<span onclick=MinMaxWidget(contentDivName,'imgMPlanerMaxMin'); id='spnMinMax' + serviceID + '' style='cursor:hand;'>" +
                            "&nbsp;<img src='Images\WidgetUp.png' id='img' + serviceID + 'MaxMin' />&nbsp;</span>" +
"Monthly Planner &nbsp; &nbsp; &nbsp; &nbsp;" +
                            "&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<span  id='spnEdit' + serviceID + '' style='cursor:hand;'>&nbsp;" +
                            "<img src='Images\editWidget.gif' id='imgEdit' + serviceID + '' onclick=window.open('sample.html','Planner','width=800,height=300,left=100,top=100'); /> &nbsp;" +
                                                        "</span>" +
                                                        "<span style='RIGHT: 100px; FONT: bold 12px arial,sans-serif; CURSOR: pointer; COLOR: #728eb8; TOP: 0px; text-align: right;'        onclick=CloseDiv(divMPlannerMain,chkMonthPlanner);><img src='Images\CloseWidget.gif' id='imgCloseMPlanner' /></span>" +
                                                        "</div>"+
                                                        "<div id=contentDivName style='BORDER-RIGHT: #b9c9ef 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #728eb8 1px solid; PADDING-LEFT: 2px; BACKGROUND: #ffffff;  PADDING-BOTTOM: 2px; OVERFLOW: auto; BORDER-LEFT: #728eb8 1px solid; WIDTH: 250px; PADDING-TOP: 2px; BORDER-BOTTOM: #b9c9ef 1px solid; TEXT-ALIGN: center'>" +
                                                    "<!--<iframe  src='sample.html' id='iFrameMPlanner' name='iFrameMPlanner' onload=_ResizeIframeHeight('divMPlannerContent',this.id);ResizeDiv('divMPlannerContent',this.id); width='100%' style='width: 98%'></iframe>-->" +
                                                    "Some Text comes here..." +
                                                        "</div>" +
                                                    "</div>" ;

---

when i try to access the contentDivName in another js, it shows that as an [object]. Can someone help me on this.


Thanks in advance.
Vinoth

Well, the way to "grab" a div, is by using its ID. There are other methods, but they are not easy and often times not smart.

Can you provide the code on how you call the div?