Question

How do I display ajax response on particular div? This statement worked alert(data[i]['title']); but I want to display on div. thanks

<td><a onclick="ajax_request('{% url recommendation id=track.id %}');" href="#"> Click Here</a></td> 

Ajax Function

function ajax_request(url) {
    $.ajax({
        url: url,
        type: 'POST',
        data: {csrfmiddlewaretoken: '{{ csrf_token }}'},
        success: function(data) {
                for(i=0;i<=data.length;i++){
                    alert(data[i]['title']); 
               }
            }
    })
}

View

@login_required
def recommendation(request, id):
    if request.is_ajax() and request.method == 'POST':
        track = Track.objects.get(pk=id)
        recommend = Song.objects.filter(title__icontains=track.title)[:5]
        results = []
        for data in recommend:
            results.append({'title': data.title})
        json = simplejson.dumps(results)
        return HttpResponse(json, mimetype="application/json")

Answer 1

Hm, depending if you already have a div you want to display the content in or you create a new one with jQuery:

Existing one with id myDiv:

$('#myDiv').html(data[i]['title']);  //also $('#myDiv').text(data[i]['title']) possible

Create new div:

$('<div/>').html((data[i]['title']);