Fails to render audio player after Ajax

I suspect I need to invoke ly.te() somehow to fix this judging by other posts here. After click, the html of the audio player is successfully added to the div but not displayed.

What should I do to make the player render?

The HTML

<div class="home_dj_list">
<div class="tzcsscb fakePlayer-S5bqTHJGYrI" data-ytvid="S5bqTHJGYrI">
<img class="fake_play" data-ytvid="S5bqTHJGYrI" src="./yt-play.svg">
</div>
</div>

The JS

jQuery( document ).on( 'click', '.fake_play', function() {
 var vid_id = jQuery(this).data('ytvid');
 var slotdiv = jQuery('.fakePlayer-' + vid_id);
 jQuery.ajax({
  url : schedule.ajax_url,
   type : 'post',
   data : {
    action : 'tz_playAudio',
    vid_id : vid_id
   },
   success : function( response ) {
    jQuery('.working-' + vid_id).fadeOut();
    slotdiv.html( response );
   }
  });
  return false;
 })

The Callback (functions.php)

add_action( 'wp_ajax_tz_playAudio', 'tz_playAudio' );
add_action( 'wp_ajax_nopriv_tz_playAudio', 'tz_playAudio' );
function tz_playAudio()
{
 $audvid = do_shortcode( '[lyte id="' . $_REQUEST['vid_id'] . '" audio="true" /]' );
 if ( function_exists('lyte_preparse_audio') )
 {
  echo lyte_preparse_audio($_REQUEST['vid_id']);
 }
 else
 {
  echo 'not exist';
 }
 die();
}

Function lyte_preparse_audio (dedicated_plugin.php)

function lyte_preparse_audio($videoId) {
    return lyte_parse('httpa://www.youtube.com/watch?v='.$videoId);
}

• This topic was modified 4 years, 6 months ago by Lineone.