Solved How to dynamically change the id of a HTML button element?

August 4, 2013 at 08:12:49
Specs: Windows 7
I have a button with an id property that I want to make its value to change dynamically. I use two javascript functions through 'setId' and 'getId' functions that I have defined. Indeed the id property of current button which is set (See 'setId' function below) must be the same as the one that is given as parameter to a javascript code (See the call of 'getId' function from 'toggle' below).

The snippet below is an example of a static html behaviour,

<td align="right">KO<input id="1" type="button"
value="[+] Expand" onclick="toggle('tb','1');"/></td>

To make it dynamic, I use 'setId' and 'getId' functions below

<script type="text/javascript">

var setId = (function () {
return function(element) {
if (! { = 1;

var getId = (function () {
return function(element) {


To make it change progressively, I call them as follows within the 'body' html element

<td align="right">KO<input id="setId(this);" type="button"
value="[+] Expand" onclick="toggle('tb',getId(this));"/></td>

Nevertheless, It seems that the id of the button ('input') does not change as expected. Indeed, click event on whatever button always refers to the first button while I want it to refer to the current. Please how could I change javascript functions to realize what I want to?

Thanks in advance

See More: How to dynamically change the id of a HTML button element?

Report •

August 4, 2013 at 19:46:10
✔ Best Answer
This sounds needlessly complex. All major browsers let you identify which object in the DOM was clicked on. Suggested reading:

How To Ask Questions The Smart Way

Report •
Related Solutions

Ask Question