[ИП] Колоквиум 2, Задача 1 (2016/17)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    function after(){
        var x = document.getElementById("in").value;
        var y = document.getElementById("result");
        var par = document.createElement("p");
        par.innerHTML= x;
        par.style.color="rgba(123,23,255,1)";
        y.appendChild(par);
        }
    function before(){
        var red = document.getElementById("red").value;
        var green = document.getElementById("green").value;
        var blue = document.getElementById("blue").value;
red=parseInt(red);
        green=parseInt(green);
        blue = parseInt(blue);

        var x = document.getElementById("in").value;
        var y = document.getElementById("result");
        var par = document.createElement("p");
        par.innerHTML=x;
        par.style.color="rgba(red,green,blue,1)";


        y.insertBefore(par, y.childNodes[0]);

    }
    function deleteNodes(){
        var x = document.getElementById("result");
        x.removeChild(x.lastChild);
    }
</script>
<div id="main">
    <input type="text" id="in">
</div>
<p><input id="red" type="text">(0-255)</p>
<p><input id="green" type="text">(0-255)</p>
<p><input id="blue" type="text">(0-255)</p>

<input type="button" onclick="after()" value="After">
<input type="button" onclick="before()" value="Before">
<input type="button" onclick="deleteNodes()" value="Delete">
<div id="result"></div>
</body>
</html>