title: Change color of like button using typescript
body: <p>I have created an app with a list of posts and a user can like/unlike a post. For the like functionality I've used SignalR and everything works fine, but I want to change the color of the like button if the logged user has already liked a post, so that he knows which posts he has liked. I've tried doing it like this:
  Html</p>
  <pre><code>&lt;button id=&quot;like&quot; (click)=&quot;liked(post)&quot; class=&quot;btn liked mr-5&quot;&gt;Like&lt;em class=&quot;fa fa-thumbs-up&quot;&gt;&lt;/em&gt; {{post.likes.length}}&lt;/button&gt;
  </code></pre>
  <p>TypeScript</p>
  <pre><code> @Input() post: Post;
   button = document.getElementById('like')
  
   constructor(private postService: PostsService)
  
   liked(post: Post) {
      const user: User = JSON.parse(localStorage.getItem('user'));
      const id = this.getDecodedToken(user.token).nameid;
      if(this.post.likes.includes(parseInt(id))) {
        this.button.style.color = &quot;red&quot;
      }
      this.postService.setLike(parseInt(id), post.id);
    }
  </code></pre>
  <p>This does not work. I get an error in the console saying <code>TypeError: Cannot read property 'style' of null</code> and <code>this.post.likes.includes(parseInt(id))</code> returns false even if the current user has liked the post. From the backend I'm sending the list of likes and my Like class contains an id, a post id and a user id. This is how this.post.likes appeares in the console and basically what I want to do is to verify if the current user has the id of 18 or 5 and if he does, the like button must be red.</p>
  <pre><code>0: {id: 13, created: &quot;0001-01-01T00:00:00&quot;, user: null, userId: 18, post: null, …}
  1: {id: 1026, created: &quot;2021-05-22T12:46:02.811552&quot;, user: null, userId: 5, post: null, …}
  length: 2
  __proto__: Array(0)
  </code></pre>