Preview how CSS border-radius values affect an element

const container = document.querySelector('#container').style; const left = document.querySelector('#left'); const tops = document.querySelector('#top'); const right = document.querySelector('#right'); const buttom = document.querySelector('#buttom'); window.addEventListener('click',(e)=>{ container.borderLeft = `2px solid red`; container.borderTopLeftRadius = Number(left.value)+'px'; }) window.addEventListener('click',(e)=>{ container.borderRight = `2px solid #e91e63`; container.borderTopRightRadius = Number(tops.value)+'px'; }) window.addEventListener('click',(e)=>{ container.borderTop = `2px solid #673ab7`; container.borderBottomLeftRadius = Number(right.value)+'px'; }) window.addEventListener('click',(e)=>{ container.borderBottom = `2px solid #009688`; container.borderBottomRightRadius = Number(buttom.value)+'px'; })