Generate Markdown for Devicons.js

// go to devicon.dev and copy/paste this into the browser console or run as a snippet
// note: there are a handful which do not have the name in the standard format so they'll 
//       need to be manually corrected. this is just meant to make it a little easier.

//selector we'll apply the event to and get icon names from
var sel = "body > div.container > div > ul > li > span > i[class*='devicon']"

// for cleanup so can tweak and just rerun all of this
try {Array.from(document.querySelectorAll(sel)).forEach(x=>x.removeEventListener('click', handleClick)) }catch{}
try {document.querySelector('#mydiv').remove() }catch{}

//div to hold the textarea with the markdown, tweak to taste.
var elem = document.createElement('div');
elem.style.cssText = 'color:black;position:fixed;height:500px;width:500px;top:1rem;left:1rem;z-index:100;border-radius: 25px;background: #BE6098;padding: 20px;';
elem.id = 'mydiv'
document.querySelector('body > div.container > header').prepend(elem);
//querySelector('body > div.container > header').appendChild(elem);

//little title
var p = document.createElement('p');
p.style.cssText = 'font-size:1.5rem;top:1rem;text-align:center;width:100%;color: whitesmoke';
p.innerHTML = 'Click the icons on the right.<br />Markdown will appear in textarea below.'
elem.appendChild(p);

//textarea to hold markdown
var t = document.createElement('textarea');
t.style.cssText = 'resize: none;white-space:nowrap;overflow:scroll;margin-top:1rem;width:100%;height:70%';
elem.appendChild(t);

//array to hold our current selections
var arr = [];

//bind array data to markdown output in textarea
var bindTextArea = () => {
    t.value = ''
    arr.forEach(x=>{
        iconname = x.split('-')[1]
        t.value +=`[<img height="50px" alt="${iconname}" src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/${iconname}/${iconname}-original.svg" />]()\n`
    })
}

//handler for the icons we may click on
var handleClick = function() {
    let val=this.classList[1];
    let idx = arr.indexOf(val)
    idx >= 0
        ? arr.splice(idx, 1)
        : arr.push(val);
    bindTextArea()
}

//select the elements and bind the handler
var icons = document.querySelectorAll(sel)
Array.from(icons).forEach(x=>x.addEventListener('click', handleClick))