A.Bachesque A.Bachesque - 1 month ago 15
Javascript Question

Change border color Javascript

Hello im very new to HTML and Javascript.Im trying to create prompt where user able to input color they want the boarder to be .From the input i want my program to change the color of the board, can anyone help me with this problem please point out what i need and where.Thank you all who can and cant help .

Bellow is code i have so far



var getColor = prompt("Choose your color ", "Enter the color ");
var color;
document.getElementById("color").innerHTML = promptUser;
if (getColor =="Yellow" || getColor =="yellow" || getColor =="YELLOW"){
color = "#FFFF66";

}


#borders{
background-color:#00ffff;
border-color:#000000;
border-width:2px;
border:solid;
}


<p id="color"></p>




Answer

I corrected your snippet to make it work. You just need to access the style.borderColor of your HTML element.

    What I changed :
  • #borders is for id="borders", so i changed for .borders and added the CSS class borders to your

    element

  • The 'solid' value is meant for border-style property
  • Your 'promptUser' variable doesn't exists so I changed it with static text

Hope this helps !

 var getColor = prompt("Choose your color ", "Enter the  color ");
 var color;
 var el = document.getElementById("color");
 el.innerHTML = "Whatever paragraph message.";
 if (getColor =="Yellow" || getColor =="yellow" || getColor =="YELLOW"){
     color = "#FFFF66";
     el.style.borderColor = color;
 }
 
.borders{
    background-color:#00ffff;
    border-color:#000000;
    border-width:2px;
    border-style:solid;
}
 
<p id="color" class="borders"></p>