ntgCleaner
ntgCleaner

Reputation: 5985

jQuery .insertAfter() and .append() not working with AJAX call

I am trying to do something that I thought I've done 100 times already... I'm getting and making a new image after an ajax call and am trying to insert it into an appropriate, pre-existing div

The HTML looks like this

<div class="preload">
    <div class="createYourOwn">...</div>
    <img src="source.com"/>
    <img src="source.com"/>
    <img src="source.com"/>
    <img src="source.com"/>
    <img src="source.com"/>
</div?

The AJAX call does this:

$.post("script.php", {phone:phone}, function(data){
    if(data){
        var newImage = "<img src='https://api.twilio.com" + data + "/>";
        $(newImage).insertAfter('.createYourOwn');
    }
});

I've tried this as well:

$("<img src='https://api.twilio.com" + data + "/>").insertAfter('.createYourOwn');

And this:

$(newImage).append('.preload');

even though that doesn't have the desired outcome.

I'd like to insert the image that I receive with the data just after the .createYourOwn div inside of .preload.

Not sure what's going on. But nothing is happening, no errors, not even an image with a borked src. Nothing at all happens.

Anyone have any ideas?

Thank you!

Upvotes: 0

Views: 752

Answers (1)

Bhojendra Rauniyar
Bhojendra Rauniyar

Reputation: 85545

Concatenate string properly:

Replace this:

var newImage = "<img src='https://api.twilio.com" + data + "/>";
// you're missing to close quote for src              here ^^ 

With this:

var newImage = "<img src='https://api.twilio.com" + data + "' />";

Or switch the quotes:

var newImage = '<img src="https://api.twilio.com' + data + '" />';

Upvotes: 3

Related Questions