I'm currently trying to delete rows in a html table
each row has three values. The third value is a checkbox that is used to checked rows that should be deleted. After clicking delete row(s) button all checked rows should be deleted. The problem is the code I have do nothing when I click the button and no row is being deleted. 

```js
var counter = 0;

function addRow() {
  var table = document.getElementById("table");
  table.setAttribute("border", "1");
  var row = table.insertRow(counter);
  row.setAttribute("id", "row" + counter);
  var cell1 = row.insertCell(0);
  var cell2 = row.insertCell(1);
  var cell3 = row.insertCell(2);
  cell1.innerHTML = document.getElementById("name").value;
  cell2.innerHTML = document.getElementById("url").value;

  var checkbox = document.createElement("input");
  checkbox.setAttribute("type", "checkbox");
  checkbox.setAttribute("name", "shouldDelete");
  checkbox.setAttribute("id", counter);
  cell3.appendChild(checkbox);

  counter = counter + 1;

}

function deleteRows() {
  var checkedItems = document.getElementsByName("shouldDelete");
  var table = document.getElementById("table");
  for (var i = 0; i < checkedItems.length; i++) {
    if (checkedItems[i].checked) {
      var row = document.getElementById("row" + i);
      table.removeChild(row);
    }
  }
}
```

```css
table {
  width: 50%;
}
```

```html
 <h1>Tell me your URL:</h1>
<p>Add a new row</p>
<p>
  <label>Your name:</label>
  <input type="text" id="name">
</p>
<p>
  <label>Your URL:</label>
  <input type="text" id="url">
</p>
<p>
  <button onclick="addRow()">Add to bottom</button>
  <button onclick="deleteRows()">Delete selected row(s)</button>
</p>
<hr>
<table id="table"></table>
```

**THIS IS HOW I SOLVE IT:**

```
function deleteRows() {
            var checkedItems = document.getElementsByName("shouldDelete");
            var ids = [];
            for(var i=0;i<checkedItems.length;i++) {
                if(checkedItems[i].checked) {
                    ids.push("row"+checkedItems[i].id)
                }
            }

            for(var i=0;i<ids.length;i++) {
                var row = document.getElementById(ids[i]);
                var parent = row.parentNode;
                parent.removeChild(row);
                counter = counter-1;
            }
        }

```