[JavaScript] Is there a way to simplify this code?

Hi, everyone. Currently, I am studying the front end by myself. It's been a month since I studied I'm doing clone coding to practice by myself.TT: It's almost random cloning, so it's not enough. T

I'm trying to clone myself on Instagram. HTML and CSS JavaScript hasn't studied much yet, but I'm just trying to copy a few of the features. It's stuck, but I don't know what to google and I don't have a clue, so I post it on intellectual ㅠ<

I'm going to follow the current "Like" function When I pressed the button, I tried to change the color of the heart icon, but when I changed the color, only the border of the heart changed, so I used two icons (buttons) full heart icon + empty heart icon. The color of the full heart is pink, and the CSS added a class called hide, so we have set it as display:none.

If you press an empty heart, a class called hide is added to the empty heart, so that the display becomes none, and the hidden class is erased in the full heart, so that the display becomes a block.

The current status of the code I did with JavaScript is

const likeNullBtn = document.querySelector('.like-null-btn'); 
const likeActionBtn = document.querySelector('.like-action-btn'); 
const CLICKED_CLASS = 'hide'; 
const likeCount= document.querySelector('#like-count'); 

likeNullBtn.addEventListener('click', ()=> { 
  likeNullBtn.classList.add(CLICKED_CLASS); 
  likeActionBtn.classList.remove(CLICKED_CLASS); 
  likeCount.innerHTML = "1,295 likes"; 
}); 

likeActionBtn.addEventListener('click', ()=>{ 
  likeActionBtn.classList.add(CLICKED_CLASS); 
  likeNullBtn.classList.remove(CLICKED_CLASS); 
  likeCount.innerHTML = "1,294 likes"; 

}); 

const likeNullBtn2 = document.querySelector('.like-null-btn2'); 
const likeActionBtn2 = document.querySelector('.like-action-btn2'); 
const likeCount2= document.querySelector('#like-count2'); 

likeNullBtn2.addEventListener('click', ()=> { 
  likeNullBtn2.classList.add(CLICKED_CLASS); 
  likeActionBtn2.classList.remove(CLICKED_CLASS); 
  likeCount2.innerHTML = "3,350 likes"; 
}); 

likeActionBtn2.addEventListener('click', ()=>{ 
  likeActionBtn2.classList.add(CLICKED_CLASS); 
  likeNullBtn2.classList.remove(CLICKED_CLASS); 
  likeCount2.innerHTML = "3,349 likes"; 
}); 

It's kind of like this. I'm sure it's too messy and there's a way to make it simple, but I don't know what to use"T" I don't like the fact that all the texts were written on the inner HTML, but I just implemented them somehow.ㅠ 클릭 I think it will be more accurate if I click the number +1, but I wrote it like this because the code was messy from the beginning. 쓰게

I want to make the same function of the two buttons work separately in different containers (?). If there is a way to write it at once by specifying it as a function, or if there is a way to operate it in a simple way, I would like to knowcrying I'm trying JavaScript right away without learning much, so I'm not good enough, but I'd appreciate your help