Solució web-dinamica-jqueryII
De wikiserver
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script>
$(document).ready(function () {
$('#angelet,#diablet,.angelet,.diablet').click(function () {
var valor = Math.floor((Math.random() * 10) + 1); //genera el número de veces que desea crear o eleminar un botón.
for (var i = 0; i < valor; i++) {
if (Math.round(Math.random())) { //genera aleatoriamente un 0 ó 1
$('div#botones').append('<input class="angelet" type="submit" value="angelet">');
$('div#botones').on('click', 'input.angelet', function () { //div es el padre y input.angelet los hijos que asocia un evento
if (Math.round(Math.random())) { //genera aleatoriamente un 0 ó 1 para crear o un angelet o un diablet
$('div').append('<input class="angelet" type="submit" value="angelet">')
} else {
$('div').append('<input class="diablet" type="submit" value="diablet">');
}
});
}
else {
$('div#botones').append('<input class="diablet" type="submit" value="diablet">');
$('div#botones').on('click', 'input.diablet', function () {
$('input:last').remove();
});
}
}
});
});
</script>
<style>
</style>
</head>
<body>
<input id="angelet" type="submit" value="angelet">
<input id="diablet" type="submit" value="diablet">
<div id="botones"></div>
</body>
</html>