I have a table constructed using Ninja Tables in Wordpress, which filters pieces of data based on a string query passed in the URL. This table has 11 columns, for brevity each column is labeled 'col1','col2',col3',...'colx'.
The Ninja Tables constructor allows for additional JavaScript code to modify parts of the table. I am looking to modify the 7th column header ('col7') if the URL query string matches an array of strings. The code I've assembled thus far is as follows:
$(document).ready(function customtask () {
var queryString = window.location.search;
var urlParams = new URLSearchParams(queryString);
var finder = urlParams.get('variable'); //Say variable equals 'varone'
console.log(finder);
var list = ['varone', 'vartwo', 'varthree'];
if (list.includes(finder)) {
$("#footable_parent_#### .ninja_table_pro tr").eq(0).find('th').eq(7).html('A Cool String');
} else {
}
});
Upon initialization of this table, I use the browser console to verify that the variable finder does equal 'varone' via console.log(finder). However, the script above does not change the 7th column header text, or any column text for that matter. What additional steps can be taken to ensure this code produces the desired result? Thanks!