EventListener is not work : <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;title&gt;I need Help&lt;/title&gt;
    &lt;style media="screen"&gt;
    .try {
        padding: 3em;
        background: #B51C35;
        text-align: center;}
    .try a {
        display: inline-block;
        padding: 0 .5em;
        font-size: 2em;
        font-weight: 900;
        color: #FFFCED;
        text-decoration: none;
        border: 5px solid #FFFCED;}
    &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;div class=""&gt;
      &lt;h3 style="text-align:center;"&gt;The event in the console was worked but remove Attribute is not work!! &lt;br /&gt;I just need the advice or if you can told me why is not working? &lt;/h3&gt;
    &lt;/div&gt;
    &lt;div class="try movemaus"&gt;
      &lt;a href="#"&gt;Book Now!&lt;/a&gt;
    &lt;/div&gt;&lt;!-- .cta --&gt;

    &lt;script&gt;
      const NEWSTYLE = document.querySelector(".movemaus");
      NEWSTYLE.addEventListener('mouseleave', function(){NEWSTYLE.removeAttribute(".try");}, false);
      NEWSTYLE.addEventListener('mouseleave', function(){console.log("The Function is work in the Console");}, false);
    &lt;/script&gt;
  &lt;/body&gt;
&lt;/html&gt;</code></pre>
</div>
</div>
</p>

<p>Dear All, 
The event in the console was worked but remove Attribute is not work!! 
I just need the advice or if you can told me why is not working?
Thanks in Advance,
Mustafa </p>
