Edit in JSFiddle

$('ul').on('click', '.remove', function() {
  $(this).parent().remove();
});

$('button').on("click", function() {
  var val = $('input').val();
    
    if (val) {
        $('ul').append("<li>"+val+"<span class='remove'> X</span></li>");
        $('input').val('');
    }
});
<h1> The guest book </h1>
<hr>
<ul>
    <li> Tom Jones <span class='remove'>X</span></li>
    <li> Omar Williams <span class='remove'>X</span></li>
    <li> Tina Houstan <span class='remove'>X</span></li> 
</ul>
    
    <input placeholder="sign your name"/>
    <button>Submit</button>

              

External resources loaded into this fiddle: