Filtering table data using multiple columns in JavaScript

I am trying to make a filter/search table and I am using the JavaScript from this site.

Here’s the script:

function myFunction() {
  // Declare variables
  var input, filter, table, tr, td, i, txtValue;
  input = document.getElementById("myInput");
  filter = input.value.toUpperCase();
  table = document.getElementById("myTable");
  tr = table.getElementsByTagName("tr");

  // Loop through all table rows, and hide those who don't match the search query
  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[0];
    if (td) {
      txtValue = td.textContent || td.innerText;
      if (txtValue.toUpperCase().indexOf(filter) > -1) {
        tr[i].style.display = "";
      } else {
        tr[i].style.display = "none";
      }
    }
  }
}

You can change which column to be used as the filter by changing the index in “td = tr[i].getElementsByTagName(“td”)[0];”

0 means the first column will be used, 1 means the second column, etc.

Using the same script, how can I use multiple columns to be the filter?