Disabling multiple HTML buttons

Question

I have multiple buttons name="angka" and id="angka":

<input type="button" name="angka" id="angka" value="1" style="width:15px" onclick="insert(1)">
<input type="button" name="angka" id="angka" value="2" style="width:15px" onclick="insert(2)">
<input type="button" name="angka" id="angka" value="3" style="width:15px" onclick="insert(3)">

onLoadPage event I try to disabled them with the below code.

document.getElementById("operator").disabled = true; 
document.getElementsByName("operator").disabled = true; 

But the result is that only the first button is disabled, the other buttons are still enabled.

How to disable the buttons with JavaScript without making unique names or ids?

solve with

`var elements = document.getElementsByClassName("classname");

for (var i = 0; i < elements.length; i++) {
  elements[i].disabled =true;
}`

Answer 1

As @Red said: Use class instead of ID

<input type="button" name="angka" class="angka" value="1" style="width:15px" onclick="insert(1)">

After that, you should be able to do something like this:

var elems = document.getElementsByClassName("angka");
for(var i = 0; i < elems.length; i++) {
    elems[i].disabled = true;
}

I'm not sure getElementsByClassName() is cross-browser, so take care. However, jQuery is good at this, so you could use that and make your life more simple.

EDIT

jQuery (untested) example for that:

$('input.angka').attr('disabled','disabled');