How to Change Border Style of HTML Element in JavaScript?

JavaScript – Change the Border Style of HTML Element

To change the border style of a HTML Element using JavaScript, get reference to this HTML element, and assign required border style value to the element.style.borderStyle property.

borderStyle property takes one of the following values.

• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset
• none
• hidden

In the following example, we will change the border style of HTML Element with id "myElement" to "dotted", in JavaScript, using element.style.borderStyle property.

example.html

Conclusion

In this JavaScript Tutorial, we learned how to change the border style of a HTML Element using JavaScript.