javascript - .append is executed more than once -

.append executed more once (3 times) though function calls once.

$('#container, #tree').on('click', 'li', function(event){         $( '#myareadiv' ).append( field:<br /><input name="myfield" id="myfield" readonly value="2"/>' );          event.stoppropagation();     }); 

try instead, because think field not right. click on tree...

$('#container, #tree').on('click', 'li', function(event) {    $('#myareadiv').append('<br /> <input name="myfield" id ="myfield" readonly value="2"/>');    event.stoppropagation();  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>    <div id="tree">    <li>      tree    </li>  </div>    <div id="myareadiv">    </div>