jQuery returns 'undefined is not a function' when appending content

Question

So, I created the code where user clicks on the button and then jQuery reads the value inside the input text and I stored that in variable. But if I want to use that variable and append that value to the element, jQuery returns undefined is not a function and it doesn't work. Here is the fiddle:

Fiddle: http://jsfiddle.net/2cf1y8Lc/1/

Answer 1

Is this about adding menu div element form text field. Here is update of fiddle code you send hope it helps.

$('#btnSubmit').on('click',function(e){
   var newMenu = $('#add_list').val();
   var elem = '<li><a href="#"><span class="glyphicon glyphicon-briefcase"></span>     '+newMenu+'</a></li>';
    $('.nav-pills.nav li').last().append(elem);
});

http://jsfiddle.net/2cf1y8Lc/2/

Answer 2

One possible reason may be if the value from text input is null and you are using parseInt() or parseFloat() on this variable. So check its value before use

    $("#btn").click(function(e){
        var myvar= $("#myhiddenfld").val();

        if(myvar=="") myvar=0;
        else myvar=parseInt(myvar);

        $("#storeinput").val(myvar);
        //or use your append code here as you like

    })