Video is not loading in a div generated dynamically

Question

I am working on a project in which I have to show the latest video uploaded to a server on a webpage that is calling a php api through $.ajax and returning a video path to display. What I have been doing is : Getting the video link from $.ajax call and storing that in cookie using JS and then fetching that value in source of video using $_COOKIE['videolink']. But when I am doing this then its showing the previous video first and showing new video when I refresh the page again(What I have been got from this is : body part is loading first and then $.ajax part so it is storing video link after loading the body part so new link will be displayed next time.) Then I tried the below method but that is also not working. Here is my coding :

$.ajax({
        type: 'POST',
        cache:false,
        url:' .. api link .. ',
        dataType: "json",
        async: 'false',
        data: 'id='+id,
        success: function(json) {
          if (json['video']) {
           var videolink = json['video'];
           $.cookie('videolink',videolink);
           var cont = '<div id="videodiv" align="center"><a id="videolink" class="media {width:500, height:500}" href="'+videolink+'"></a></div>';
        alert(cont);
        $('#show').html(cont);

====

body part is

<div id="show" class="container">


</div>

Any help ? so that $.ajax can load before the webpage's body loading.

Answer 1

将ajax放入函数中，然后从Body的onLoad调用该函数