Как взять значение формы

у меня есть форма, которая дает возможность добавить и удалить строчки. При нажатии кнопки отправить, надо собрать все значения, которые пользователь записал туда и отправить postОМ на нужный контроллер

<div class="input_fields_wrap">
        <input type="submit" id="submit" value="Sent" />
        <button class="add_field_button">Add More Urls</button>
        <div>
            <input type="textarea" name="url" value="1">
        </div>
    </div>

Проблема в том, что через .val(); я не получаю значение (при этом в консоли вижу у el кучу данных). Лучше через map (как передать дальше значения в ) или each такое делать?

 $.map($("input[name='url']"), function (el) {
                var value = $(el).val();
                return value;
            })

полный код js

var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initlal text box count
$(add_button).click(function (e) { //on add input button click
    e.preventDefault();
    if (x < max_fields) { //max input box allowed
        x++; //text box increment
        $(wrapper).append('<div><input type="textarea" name="url" value="' + x + '" /><a href="#" class="remove_field">Remove</a></div>'); //add input box
    }
});

$(wrapper).on("click",
    ".remove_field",
    function(e) { //user click on remove text
        e.preventDefault();
        $(this).parent('div').remove();
        x--;
    });
    $("#submit").click(function () {
        var urlList = [];
        //$.each($('input[name=test_name]'), function () {
        //    var value = $(this).val();
        //    urlList.push(value);
        //});
        $.map($("input[name='url']"), function (el) {
            var value = $(el).val();
            return value;
        })
        var postUrl = { Url: urlList };
        $.post("/api/controller/sent", postUrl);
    });