Why the css font-weight property is not working in my case?

Question

My selected_cell just contains a paragraph as its child with a default normal class applied.

My css code:

.normal{
    font-weight: normal;
}.bold{
    font-weight: bolder;
}

My JS Code:

function bold()
{
  var selectedcell=document.querySelector('.selected-cell');
  
  if(selectedcell.children[0].class=="normal")
  {
  selectedcell.children[0].class="bold";console.log(selectedcell.children[0])}
  else
  {
  selectedcell.children[0].class="normal";console.log(selectedcell.children[0])};
}

Here I have created a function bold wherein I make the text of the selected cell look bolder using the font-weight property.But apparently it doesnt work.

Answer 1

Try this

function bold()
{
  let selectedcell = document.querySelector('.selected-cell');
  
  if(selectedcell.children[0].classList.contains("normal"))
  {
  selectedcell.children[0].classList.replace("normal","bold");
  }
  else
  {
  selectedcell.children[0].classList.add("normal");
  };
}