Question

Buildgames returns rows:

<a>....</a>
<a>....</a>

When I click on each a the Buildcar_s function returns all the data inside an alert.

Instead of this alert I want to put all the results in a div under each a, so it would look like:

<a>.....clicked ...</a>
<div>....
    ...
</div>
<a>....not clicked...</a>
<a>....not clicked...</a>
<a>....not clicked...</a>

How can we put a div only under the a which was clicked?

function Buildcar_s(items) {
    var div = $('<div/>');
    $.each(items, function() {
        var car_ = this.car_;
        $('<a>' + this.car_ + '----' + this.Names + '---' + '</a>').click(function() {
            _Services.invoke({
                method: 'GetgamesRows',
                data: {
                    car_Number: car_
                },
                success: function(car_s) {
                    
var div = Buildgames(car_s);
                         $(div).insertAfter($a);
                }
            });
        }).appendTo(div);
        $('<br/>').appendTo(div);
    });

    $("#leftRows").append(div);
}

function Buildgames(items) {
    var place = '<div>';
    $.each(items, function() {
        place += 'mmmmmm<br/>';
    });
    place += '</div>';

return place;
}

Answer 1

Try this, relevant changes have been commented:

function Buildcar_s(items) {
    var div = $('<div/>');
    $.each(items, function() {
        var car_ = this.car_;
        $('<a>' + this.car_ + '----' + this.Names + '---' + '</a>').click(function() {
            var $a = this;
            _Services.invoke({
                method: 'GetgamesRows',
                data: {
                    car_Number: car_
                },
                success: function(car_s) {
                    var div = Buildgames(car_s);
                    // this inserts the HTML generated from the function, 
                    // under the A element which was clicked on.
                    $(div).insertAfter($a); 
                }
            });
        }).appendTo(div);
        $('<br/>').appendTo(div);
    });

    $("#leftRows").append(div);
}

function Buildgames(items) {
    var place = '<div>';
    $.each(items, function() {
        place += '<div style="float: right;">&nbsp;&nbsp;&nbsp;' + this.CITY + '&nbsp;&nbsp;&nbsp;' + '</div><BR />' + +'<br/><br/>';
    });
    place += '</div>';

    return place; // returns the string created, as opposed to alerting it.
}