why this script wont work

why this script wont work

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My fruit list:</h1>

enter your fruits: <input  type="text" id="foo" value="" /><br>
<button id="buttonclick">Get Value</button>
<ol id="fruitList"></ol>






<script>

var list = $("#fruitList");
var fruits = ["banana", "apple", "peach"];

function redraw (){
  list.html("");
$.each(fruits, function(index, value){$("<li/>").text(value).appendTo(list);});

}

redraw();

var value = $("#foo").val();
$("#buttonclick").click(function(){


fruits.push(value);
  redraw()});


</script>

</body>
</html>