JSFiddle - React, Tailwind, and code Playground

by Siva Subramaniam

HTML

<div id="output">
    <ul id="alphabetlist"></ul>
</div>

JavaScript

/* 
 * Write code to print a list of the alphabet ('a' to 'z') in the
 * 'output' div. One alphabet as one list item.
 * Each list item should be of a different color code.
 */
/* To get random color
Parameter :
colorsToBeExempted - An array of strings with each string representing a hexadecimal color that should not come as a return value from this function
Return Value : 
A string containing the hexadecimal value of color
*/
function getRandomColor(colorsToBeExempted) {
    var color = '#';
    try {
        var letters = '0123456789ABCDEF'.split('');
        for (var i = 0; i < 6; i++) {
            color += letters[Math.round(Math.random() * 15)];
        }
        if (typeof colorsToBeExempted !== "undefined" || colorsToBeExempted.length !== 0) {
            if ($.inArray(color, colorsToBeExempted) > -1) {
                color = getRandomColor(colorsToBeExempted);
            }
        }
    } catch (exception) {
        console.log("Error while getting random color");
        console.log(exception.message);
    }
    return color;
}
/* To display Alphabets as list Element
Parameter :
ulParentId - A string containing the Id of ul list element for which the alphabet list elements will be created
Return Value :
None
*/
function displayAlphabets(ulParentId) {
    var parentElement = document.getElementById(ulParentId);
    if (parentElement !== null) {
        var childElement;
        var alphabetColor;
        var colorArray = [];
        for (var iterator = 97; iterator < 123; ++iterator) {
            childElement = document.createElement('li');
            childElement.appendChild(document.createTextNode(String.fromCharCode(iterator)));
            alphabetColor = getRandomColor(colorArray);
            childElement.style.color = alphabetColor;
            colorArray.push(alphabetColor);
            parentElement.appendChild(childElement);
        }
    } else {
        alert("Master ! Your ul element's Id is wrong. I cannot print alphabets");
   ...