functions, variable and jquery
<p>I have 8 search filters user can choose. When user clicks on filter it opens options for this filter. When user clicks out, the function <code>hideFilterSearch()</code> is triggered. I have problem about understanding of scope for variable formData (see below).</p>

<pre><code>$(document).ready(function() {
    var formData = $("form").serialize();
});

function hideFilterSearch() {
    console.log(formData);
    $(".filters").hide();
    newFormData = $("form").serialize();
    if (formData != newFormData) {
        //newFormData is sent with ajax and search results are updates
    }
    formData = $("form").serialize();  
}

//show, hide filter changer
$('body').click(function(event) {
    if (!$(event.target).closest('.filter').length) {        
        hideFilterChanger();
    };
});
</code></pre>

<p>Console log gives me empty string in this case. I tried also to send <code>formData</code> as argument <code>()hideFilterSearch(formData)</code>, but then the problem is <code>formData</code> won't be updated. I am not sure what is the correct way to pass <code>formData</code> to function, but still update it's value inside function when it is changed.</p>
