javascript：更改其他div内的多个div的属性

Question

I have table:

<table class="table table-condensed" id="mbusTable">
    <label><h5>rtu</h5></label>
    <tbody>
        <td><input type="text" id="mid" class="span1" placeholder="mid"></td>
        <td><input type="text" id="type" class="span1" placeholder="typem"></td>
        <td><input type="text" id="inverce" class="span1" placeholder="inverce"></td>
        <td><input type="text" id="mbaddr" class="span1" placeholder="mbaddr"></td>
    </tbody> 
</table>

All I want is to add _mbusTable to all inputs inside it. Here's what I have now:

        function correctIDs(tableID)
            var table = document.getElementById(tableID);
            var colCount = table.rows[0].cells.length;
            var prefix = tableID;
            for(var i=0; i<colCount; i++) {
                prefix += "_" + table.childNodes[1].getAttribute('id');
                table.childNodes[1].setAttribute('id',prefix);
                prefix = tableID;
            }
        };

But I guess it changes only first <input> . How can I jump to the next? Sorry if it's something obvious. Thanks

Answer 1

function correctIDs(tableID) {
    var table = document.getElementById(tableID);
    var inputs = table.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        var prefix = tableID + "_" + inputs[i].getAttribute('id');
        inputs[i].setAttribute('id', prefix);
    }
};


correctIDs("mbusTable");