javascript - The button is not added via a variable in the TEXT method -

i'm doing task sheet. dynamically add items list along delete button, button not displayed. why? can write code differently, why code not work?

$(function() {         $("#button").click(function() {       var text = $("#text").val();       if(text != "")      {        var del = $("<input type='button' value='x'></input>").text();        //var item = $("<li></li>").text(text + del);          var item = $("<li></li>").text(text + del); // dont work! why?        $("ul").append(item);      }          });      });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div>    Введите текст:     <input id="text" type="text"></input>    <input id="button" type="submit"></input>  </div>  <div class="ul">    <ul>    </ul>  </div>

with code want achieve result. can not. explain i'm wrong?

<li>some text <input type='button' value='x'></input></li>

in code $("<input type='button' value='x'></input>").text() returns undefined.

try this:

   $(function() {         $("#button").click(function() {          var text = $("#text").val();          if(text != "")         {           var delhtml = "<input type='button' value='x'></input>";            var item = $("<li></li>").html(text + delhtml);            $("ul").append(item);         }        });      }); 

wiki