jQuery.Deferred exception: Illegal invocation TypeError: Illegal invocation

Пытаюсь вставить значение из input. Когда прописываю строкой - все работает, когда тяну из переменной - jQuery.Deferred exception: Illegal invocation TypeError: Illegal invocation

 var city = document.getElementById('city').val;
$(function () {
                var params = {
                    'methodProperties': {
                        'CityName':city, //var city or string(string works)
                        'Language': 'UA'}
                };
                $.ajax({
                    url: 'https://api.novaposhta.ua/v2.0/json/?' + $.param(params),
                    beforeSend: function (xhrObj) {
                        xhrObj.setRequestHeader('Content-Type', 'application/json');
                        return Number;
                    },
                    type: 'POST',
                    dataType: 'jsonp',
                    data: '{body}'

вообще задача получать из инпута, по его изменении, слово и вставлять его в 'CityName', на данном этапе использую готовое значение инпута, но если подскажете решение для использования инпута по его изменению будет еще лучше (пытался с onchange и oninput но руки крюки)