Como faço para limitar a quantidade de exibição de cada div criada por cada botão, e fazer com que quando o botão for clicado novamente some +1 no campo txt_result.
<script>
function conteudo(btn) {
//Cria a div
var div_c = document.createElement("DIV");
div_c.style.width = "30%";
div_c.style.height = "35px";
div_c.style.margin = "30px 10px";
div_c.style.background = "#ffe0e0";
div_c.innerHTML = "Item: <input name='txt_result' type='text' value='' />";
document.getElementById("main").appendChild(div_c);
//Pega os conteúdos e exibe
var num = btn.previousElementSibling.value;
div_c.querySelector('[name="txt_result"]').value = num;
}
</script>
<input name="txt" id="txt_1" type="text" value="1" />
<input name="btn1" id="btn1" type="button" value="Botao 1" onclick="conteudo(this)" />
<br />
<input name="txt" id="txt_2" type="text" value="2" />
<input name="btn2" id="btn2" type="button" value="Botao 2" onclick="conteudo(this)" />
<br />
<input name="txt" id="txt_3" type="text" value="3" />
<input name="btn3" id="btn3" type="button" value="Botao 3" onclick="conteudo(this)" />
<div id="main"></div>