Okay, I’m guessing the answer is simple, but I’m trying to add the line number to the first input row (not sure if this conforms to good code practice) and I would like the line number to increment with each line that is added. So far, no success, even after spending several hours researching getElementById and getElementsByTagName. Many thanks in advance for your time, and feel free to direct me to a reading resource. 
Edit: Okay, so I’ve got it working… sort of. At this point the line numbers are being incremented, however, they are not in quite the right order. The first line is receiving the newly incremented number, and the original line is being pushed to the bottom of the list. See my revised code below. Also, my deleteRow function is not working yet, but I’ll get it!!
<input type="button" value="Add" onClick="addRow('dataTable', 'tdLineNum')" />
<input type="button" value="Remove" onClick="deleteRow('dataTable')" />
<table>
<tr id="colHeadings">
<th id="lineNum">Line#</th>
<th id="contractNum">Contract#</th>
<th id="descr">Description</th>
<th id="qty">Qty</th>
<th id="priceEach">Each</th>
<th id="priceTotal">Line item total:</th>
</tr>
</table>
<table id="dataTable" class="form" border="1">
<tbody>
<tr id='row_0'>
<p>
<td>
<input type="text" id="tdLineNum" required="required" name="lineNum" readonly value="1">
</td>
<td>
<input type="text" id="tdContractNum" required="required" name="contractNum">
</td>
<td>
<input type="text" id="tdDesc" required="required" name="desc">
</td>
<td>
<!-- <label>Quantity</label>-->
<input type="text" id="tdQty" required="required" name="qty" oninput="calculate('row_0')">
</td>
<td>
<!-- <label for="price">Price</label>-->
<input type="text" id="tdPriceEach" required="required" class="small" name="price" oninput="calculate('row_0')">
</td>
<td>
<!-- <label for="total">Total</label>-->
<input type="text" id="tdPriceTotal" required="required" class="small" name="total">
</td>
</p>
</tr>
</tbody>
</table>
<script type="text/javascript">
var initialLineNum = 2;
function addRow(tableID, lineNum) {
// alert("in addRow");
// get a reference to the table
var table = document.getElementById(tableID);
var line = document.getElementById(lineNum);
// alert(line);
// HTMLTableElement.rows read-only property returns a live HTMLCollection of all the rows in the table.
// The rows included in the associated <thead>, ,<tfoot> and <tbody> elements. Although the property is read-only,
// the retuned object is live and allows th modification of its content.
var rowCount = table.rows.length;
if (rowCount < 100) { // limit the user from creating fields more than your limits
// Insert a row in the table at row index(rowCount) and return a reference to the row
var row = table.insertRow(rowCount);
// determine number of columns
var colCount = table.rows[0].cells.length;
row.id = 'row_' + rowCount;
for (var i = 0; i < colCount; i++) {
// Insert a cell in the row
var newcell = row.insertCell(i);
newcell.outerHTML = table.rows[0].cells[i].outerHTML;
}
var listitems = row.getElementsByTagName("input");
// var listitems = document.getElementById(lineNum);
line.setAttribute("value", initialLineNum);
for (i = 0; i < listitems.length; i++) {
// alert("hello");
listitems[i].setAttribute("oninput", "calculate('" + row.id + "')");
// listitems[i].setAttribute("value", lineNum +1);
}
} else {
alert("Maximum 100 items per purchase order.");
}
initialLineNum++;
}
function deleteRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for (var i = 0; i < rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if (null !== chkbox && true === chkbox.checked) {
if (rowCount <= 1) { // limit the user from removing all the fields
alert("Cannot Remove all the Passenger.");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}
function calculate(elementID) {
var mainRow = document.getElementById(elementID);
var myBox1 = mainRow.querySelectorAll('[name=qty]')[0].value;
var myBox2 = mainRow.querySelectorAll('[name=price]')[0].value;
var total = mainRow.querySelectorAll('[name=total]')[0];
var myResult1 = myBox1 * myBox2;
total.value = myResult1.toFixed(2);
}
</script>
Tracing code now…