jquery - Jquery div内にinsertAfterを使用して複数のスパンを含める

Question

fotoramaの下でコントロールパネルをやっています。jqueryで作成されたボタンのスパンをdivに追加できないことを除いて、すべてが機能しています。fotorama_nav_wrap の後にする必要があるため、insertAfter を使用しています。追加で遊んでいますが、管理できません。このdivにボタンを配置したい：

これが jquery です。 // 1. fotorama を手動で初期化します。var $fotoramaDiv = jQuery('.fotorama_custom').fotorama();

// 2. Get the API object.
var fotorama = $fotoramaDiv.data('fotorama');


if (jQuery('.fotorama_custom__arr').length > 0) {
    jQuery('.fotorama_custom__arr').remove();
}

jQuery("<span class='fotorama_custom__arr--prev'>       <</span>").insertAfter(".fotorama__nav-wrap");
jQuery("<span class='fotorama_custom__arr--next'>></span").insertAfter(".fotorama__nav-wrap");
jQuery("<span class='fotorama_custom__buttonplay'>P</span>").insertAfter(".fotorama__nav-wrap");
jQuery("<span class='fotorama_custom__buttonstop'>S</span>").insertAfter(".fotorama__nav-wrap");
jQuery('.fotorama_custom__arr--prev').click(function () {
fotorama.show('<');
});
jQuery('.fotorama_custom__arr--next').click(function () {
    fotorama.show('>');
});
$(function () {
    var $fotorama = $('#start-n-stop'),
            fotorama = $fotorama.data('fotorama'),
            $thumbBorder = $('.fotorama__thumb-border', $fotorama),
            thumbBorderColor = $thumbBorder.css('border-color'),
            thumbBackground = $thumbBorder.css('background'),
            $start = $('#start'),
            $stop = $('#stop');
            etc.

解決策で更新: 今は動作します。insert.After を追加に変更し、div を追加しました:

 $('.fotorama') // Initialize .fotorama() .each(function () { 
    $('.fotorama__nav', this).after( 
    $(this) .next('.fotorama-control') .
    show() ); }); $('.fotorama-control').append
    ("<span class='fotorama_custom__arr--prev'><</span>"); 
    jQuery('.fotorama_custom__arr--prev').click(function () { 
    fotorama.show('<');