Change CSS colour when button clicked

See more:

Javascript

PHP

I am trying to change colour of a heart from red -> green

I've tried some code, but it doesnt seem to change it when clicked.


Error i get is:

annot read property 'getElementsByClassName' of null

What I have tried:

JQUERY ->

		var header = document.getElementById("heart");
var btns = header.getElementsByClassName("btn");
for (var i = 0; i < btns.length; i++) {
  btns[i].addEventListener("click", function() {
    var current = document.getElementsByClassName("active");
    current[0].className = current[0].className.replace(" active", "");
    this.className += " active";
  });
}

PHP ->

if (isset($arr['BName'][$i])) {
             echo '<td>' . $arr['BName'][$i] . '<button style="text-align:right;float:right;" class="favourites"  id="' . $arr['BName'][$i] . '" value="' . $dbRow["UserID"] . '<button class="btn" id="heart">❤️</div></button></td>';
         } else {