Unable to determine if a string contains a word from an array

Question

I'm trying to determine if a string contains a word from an array by using jQuery's inArray function, which is shown here https://stackoverflow.com/a/18867667/5798798

In my example below, it should print 'hi' to the console twice as the word 'Hello' is in the string twice and is in the array, however it doesn't.

var array = ["Hello", "Goodbye"];

a = document.getElementsByClassName("here");

for (i = 0; i < a.length; i++) {
  itag = a[i].getElementsByTagName("i")[0];
  if (jQuery.inArray(itag.innerHTML, array) !== -1) {
    console.log('hi');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="here"><i><a href="link.php">Hello</a> | <a href="link2.php">Example</a></i>
</div>

<div class="here"><i><a href="link.php">Hey</a> | <a href="link2.php">Hello</a></i>
</div>

Answer 1

Change inArray function with array.some(text => itag.textContent.includes(text)).

Declare all variables via var or const or let.

Instead of innerHTML use textContent. This will not try to parse the content and will work faster.

var array = ["Hello", "Goodbye"];

var a = document.getElementsByClassName("here");

for (var i = 0; i < a.length; i++) {
    var itag = a[i].getElementsByTagName("i")[0];
    var textContent = itag.textContent;
    if(array.some(text => textContent.includes(text))) {
       console.log(textContent);
    }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="here"><i><a href="link.php">Hello</a> | <a href="link2.php">Example</a></i>
</div>

<div class="here"><i><a href="link.php">Hey</a> | <a href="link2.php">Hello</a></i>
</div>

Answer 2

You are checking whether innerHTML is in the array or not.

Actually you should check whether the inner html consists of any of the array element.

So if you convert the above statement to code, it should be

var array = ["Hello", "Goodbye"];

a = document.getElementsByClassName("here");

for (i = 0; i < a.length; i++) {
   debugger;
   var itag = a[i].getElementsByTagName("i")[0];
   for (var k in array) {
    if(itag.innerHTML.indexOf(array[k]) > -1){
    console.log('hi');
    }
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="here"><i><a href="link.php">Hello</a> | <a href="link2.php">Example</a></i>
</div>

<div class="here"><i><a href="link.php">Hey</a> | <a href="link2.php">Hello</a></i>
</div>