How to code Javascript into the dashboardcode without loading a js file?

[JvKessel]

Hello Splunkers,

I'm trying to code some Javascript into my Splunk simpleXML dashboard via Edit Dashboard -> Source, to conditionally adjust the colors of the rows in the dashboard. The script works fine in other text editors, but does not seem to load in the Splunk dashboard. Does anybody know how I could get my script to load in the dashboard? The HTML and CSS code I have coded directly in the SimpleXML works fine, it's just the Javascript that won't load. I have put in the script as follows (this is a shortened version);

<row>
    <panel>
      <html>
        <style>
         .statusError{
            background-color: #D93F3C !important;}
         .statusOk {
            background-color: #65A637 !important;}
         .statusPaused {
            background-color: #DDDDDD !important;}
         </style>

        <script>
          window.addEventListener("DOMContentLoaded", function() {
  var table = document.getElementById('theTable');
  var tbody = table.getElementsByTagName('tbody')[0];
  rijKleuren(tbody.getElementsByTagName('td'));
}, 
  false);

var rijKleuren = function(cells){
for (var i=0, len=cells.length; i<len; i++){
    if (cells[i].innerHTML == 'ERROR'){
        cells[i].className += '' + 'statusError';
      cells[i].parentNode.className += '' + 'statusError';
    }
    else if (cells[i].innerHTML == 'OK'){
        cells[i].className += '' + 'statusOk';
      cells[i].parentNode.className += '' + 'statusOk';
    }
  else if (cells[i].innerHTML == 'PAUSED'){
        cells[i].className += '' + 'statusPaused';
      cells[i].parentNode.className += '' + 'statusPaused';
    }
 }
        </script>
      </html>
      <table id="theTable">
        <title>Scripts theTable</title>
etc(rest of table specifications)

Might it be that I have to use a different type of EventListener? Or is it just not possible to incorporate Javascript without a seperate JS file?