Описание: в поле ввода задаем цвет(например,red). формируется квадрат 50*50, красного цвета и кнопка удаления для него. При нажатие на кнопку add - я должен добавить еще элемент (например, зеленый квадрат) и т.д. Сейчас при добавлении создается [object HTMLDivElement], а не квадрат с заданным цветом, помогите это исправить, пожалуйста. Функция удаления работает.
<!DOCTYPE html>
<html>
<head>
<title align = "center"> Палитра цветов</title>
<style>
ul
{
margin:0;
padding:0;
}
</style>
</head>
<body>
<input type="text" id="input" onkeyup="doIt()"/>
<button onclick="addElem()">add</button>
<div id='kvadrat'>
</div>
<script type="text/javascript">
var div, b, yo,element;
var div=document.getElementById("kvadrat");
var buts=div.getElementsByTagName("button");
for (var i=0 in buts)
buts[i].onclick=delElem;
function addElem()
{
var p=document.createElement("p");
//var p=b;
p.innerHTML = b;
div.appendChild(p);
var but=document.createElement("button");
p.appendChild(but);
but.innerHTML="x";
but.onclick=delElem;
}
function doIt()
{
b = document.getElementById('kvadrat');
b.style.background = input.value;
b.style.width = '50px';
b.style.height = '50px';
}
function delElem()
{
e=window.event;
element=e.srcElement.parentNode;
div.removeChild(element);
}
</script>
</body>