встраивание объекта с PDF программно на страницу

Question

Я пытаюсь разрешить пользователю щелкнуть по элементу, а затем в div есть объект, который отображает PDF.Весь код работает на Chrome, но на Safari на ios объект не отображается.Ни один не делает тег вставки.Как я могу получить PDF для ios?

html:

 <div class="document-holder" id="offense-incident">
    <img src="img/incident.jpg" class="embedded-pdf" />
    <p class="pic-caption side-cap"><i class="fas fa-search-plus zoom"></i>1978 police report</p>
  </div> 

<lightbox>
<div class="close"><i class="fas fa-times-circle"></i></div>
</lightbox>

jquery:

$('.document-holder').on('tap', function() {
    var thisID = $(this).attr('id');
    //$('lightbox').remove('embed');
    //$('lightbox').remove('object');
    $('object').remove();
    //<embed src="" type="application/pdf" class="pdf-doc" style="width: 100%; height: 100%;" />

    if ( $(this).attr('id') ) {
        //var newEmbed = "<embed type='application/pdf' class='pdf-doc' src='pdf/" + thisID + ".pdf' />";
        //var newEmbed = "<object style='width: 100%; height: 90%;' type='application/pdf' data='pdf/" + thisID + ".pdf?#zoom=85&scrollbar=0&toolbar=0&navpanes=0'><p></p></object>";
        //$('lightbox').append(newEmbed);
        $('lightbox').append("<object style='width: 100%; height: 90%;' type='application/pdf' data='pdf/" + thisID + ".pdf?#zoom=85&scrollbar=0&toolbar=0&navpanes=0'><p></p></object>");
        $('lightbox').css('z-index','6');
        $('lightbox, mask').fadeIn();
    }


});