jQuery auto complete producing results bug

[Q695]

I'm struggling to produce results to the screen from the following code:

 

HTML:

<script src="http://code.jquery.com/jquery-2.1.4.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<script src="../scripts/autocomplete.js"></script>

<div>
    <input type='text' class='search_input' name='search' id='search' placeholder='search' autofocus onkeypress='search_func("http://webfarm.io/subs/homefront/list_articles.php" , "search_output")'>

    <div id='search_output' class='search_output'></div>
</div>

Javascript:
 

function search_func( href , target){
        var search = $("#search").val();
        search = $.trim(search);

        if(search){
            $.ajax({
                method: "POST",
                url: href ,
                data: { search: search }
            })
                .done(function( msg ) {
                    target.innerHTML = msg; // as above, data holds the result of the request, so all the data returned from your results.php file are in this param but please see below;
                    console.log(msg);
                });
        } else {
            target.innerHTML = '';
        }
}

What am I doing wrong?

Why won't it produce the desired results?

Sorry if I'm looking like a help vamp, but I'm not trying to be.

[requinix]

target is merely the string "search_output". Not the element.