text overflow

function textHidden(el, x) {
   var styles = window.getComputedStyle(el)
   var h = parseFloat(styles.height.replace('px', ''))
   var lh = styles.lineHeight
   var fontSize = parseFloat(styles.fontSize.replace('px',''))
   var text = el.innerText
   var w = fontSize*0.625
   var ws = parseFloat(styles.width.replace('px', ''))/w
   var lines = h/fontSize
   
   if (x*fontSize >= h) return
   console.log(ws, text)
   var showText = text.slice(0,parseInt(ws*x) - 8)
   el.innerHTML = showText + '... more'
   el.onclick=function(){el.innerHTML = text}
}

textHidden(document.querySelector('p'), 10)