ajax really not needed, nor an iframe for that matter. Someone wants to upload an image called "dogface.png". You have that name and should know where your php is going to place it. I'd put it into a folder. When ajax tells you success has happened display the image.
<div id="cf" style="height:100px;width:100px;">
<img id="top" style="width:100%;height:100%;" src="">
</div><br /><br /><button type="button" onclick="showit();">Ajax Success</button>
document.getElementById("top").src = "images/dogface.png"; // PUT YOUR IMAGE HERE
@esthera: Sorry my mind reading skills are so bad. No way to know you were putting image on another page without code (Show the importance to paste code here) and your insistence on not refreshing the page thew me.
or just google whatever it is you're learning: "mdn websockets" or "mdn localstorage" or "mdn a ping" almost always gets the latest info out there and well-written comprehensive documentation, up-to-date compat tables, and relevant examples.
i would not use w3fools for anything, they are outdated in their references, the tutorials demonstrate improper ways of doing things, and then there's all the advertising... yuck.
__________________ my site (updated 5/13) STATS (2013/5) HTML5:90.2% MOB:14% IE7:0.5% IE8:8.6% IE9:9.8% IE10:10%