问无法将事件侦听器添加到html元素中怎么办？

EN

var a = document.getElementById("barra2");

a.addEventListener("click", handlemouse);

function handlemouse() {
  document.getElementById("barra2").style.color = "#7B3FBF";
}

<div class="container-fluid">
  <div class="artbox">
    <div class="row">
      <div class="col-md-8">
        <p class="h-100 d-inline-block" ; id="barra1"></p>
      </div>
    </div>
    <div class="row">
      <div class="col-md-4">
        <p class="h-100 d-inline-block" ; id="barra2">b2</p>
      </div>
    </div>
    <div class="row">
      <div class="col-md-4">
        <p class="h-100 d-inline-block gradient" ; id="barra3"></p>
      </div>
    </div>
    <div class="row">
      <div class="col-md-4">
        <p class="h-100 d-inline-block gradient" ; id="barra4"></p>
      </div>
      <div class="row">
        <div class="col-md-4">
          <p class="h-100 d-inline-block gradient" ; id="barra5"></p>
        </div>
      </div>
    </div>
  </div>