DonKain DonKain - 21 days ago 3
CSS Question

Bold/Unbold button

I'm currently working with an online text editor as part of a project, and to say the least, i'm having a small issue with my bold button.

Here is my button in HTML:

<button id="b" onclick="Bold()">Bold</button>


And here is my function in JavaScript:

function Bold()
{
var ban;
ban = document.getElementById("b");


if(ban == true)
{
document.getElementById("texto").style.fontWeight = 'bold';
}


else
{
document.getElementById("texto").style.fontWeight = 'normal';

}
}


If i take away everything and just leave it as:

function Bold()
{
document.getElementById("texto").style.fontWeight = 'bold';
}


It bolds my text, but my goal is to be able to unbold the text inside my textarea when i click the button a second time.

What am i doing wrong?

Answer

function Bold() 
{
 
   var  ban =document.getElementById("texto").style.fontWeight ;
 
 if(ban == 'normal')
    {
        document.getElementById("texto").style.fontWeight = 'bold';
    }
 else
    {
        document.getElementById("texto").style.fontWeight = 'normal';
    }
}
<button id="b"   onclick="Bold()">Bold</button>

<p id="texto" style="font-weight:normal;">Hi</p>

Comments