Пытается использовать javascript для заполнения тега для кнопки class

Question

Редактировать 3: Я просто начну.

Я не могу опубликовать две ссылки, но тема, которую я использую, - это красная чернила из themeforest, а страница, над которой я работаю, - это страница с портфолио, если вы хотите сделать это.

Когда вы нажимаете один из элементов портфеля, таких как «Истинные гангстеры», вся информация извлекается из div и подключается к предыдущему разделу для форматирования.

Все, что я хочу сделать, это добавить кнопку к этим элементам портфеля и иметь возможность вытащить ссылку из div и отформатировать ее в виде кнопки.

В jsfiddle я включил отформатированный div и раздел «истинные гангстеры», от которого форматированный div получает свою информацию.

Я также включил все портфельной части яваскрипта, но я уверен, что это важная часть:

//Update text info 
 
\t  function updateText(current) { 
 

 
\t  var title = current.attr('data-title'); 
 
\t  var desc = current.attr('data-description'); 
 
\t  var date = current.attr('data-date'); 
 

 
\t  controls.find('h2').html(title); 
 
\t  controls.find('p').html(desc); 
 
\t  controls.find('.date .day').html(date.split(',')[0]); 
 
\t  controls.find('.date .month').html(date.split(',')[1]); 
 
\t  controls.find('.date .year').html(date.split(',')[2]); 
 

 
\t  } //End Update text info

demo

Это оказывается более сложным, чем я думал.

---

---

Старый раздел, игнорировать меня:

Так что я пытаюсь использовать JavaScript, чтобы получить кусок кода из другой части веб-страницы, а затем вставить его в другую часть создать ссылку на

<div class="button"></div> 


<div class="getVid" 
    data-epdLink="CdDDY5nVA3A" 
> 

, поэтому я хочу, чтобы получить кусок кода из DIV getVid и поместить его в кнопку DIV в виде ссылки.

поэтому у меня есть этот бит JavaScript:

var endLink = current.attr('data-epdLink'); 

var fullLink = '<a href="https://www.youtube.com/watch?v=' + endLink +'">"Click for Video"</a>'; 

controls.find('button').html(fullLink) 

Это не похоже на работу. Я использовал этот тип вещей прежде, чем вставлять заголовки и текст, но я думаю, что есть что-то другое, что мне нужно сделать, чтобы вставить код.

Любые идеи?

Вот ссылка на скрипке, если это помогает: [JSFiddle] [3]

Редактировать

Забыл упомянуть, что там будет несколько классов getVid так это зависит от того, какой я есть открытый и data-epdLink будет отличаться для каждого.

Edit 2

ИТАК в моем новом jsfiddle вы можете увидеть, что все форматирование находится в верхней части форматирования HTML маркированный VID элемента. Следующие два элемента, каждый из которых помечен как информация о выводе элемента vid из раздела форматирования vid, используя javascript.Этот код из шаблона, поэтому я не совсем уверен, что происходит, но я включил javascript, который меняет изображение в каждом разделе элемента vid, потому что я думаю, что я могу изменить ссылку на кнопку, используя что-то в этих строках. Вы можете увидеть кнопку div сразу после обеих таблиц в разделе форматирования vid.

Новый jsfiddle здесь: [новый JS скрипку] [4]

редактировать 3: Я просто хочу, чтобы отчасти начать. Прежде всего, вот шаблон, который я использую [Red Ink Template] [1]

Когда вы нажимаете один из элементов портфеля, таких как «True Gangsters», вся информация вытягивается из div и подключается к предыдущему разделу для форматирование.

Все, что я хочу сделать, это добавить кнопку к этим элементам портфеля и иметь возможность вытащить ссылку из div и отформатировать ее в виде кнопки.

Это оказалось более сложным, чем я думал.

Answer 1

Во-первых, вам нужно закрыть .getVid DIV. Это рекомендуется использовать data() метод доступа data- атрибуты:

var endLink = current.data('epdlink'); 

var fullLink = '<a href="https://www.youtube.com/watch?v=' + endLink +'">"Click for Video"</a>'; 

controls.filter('.button').html(fullLink); 

вы получите его в нижнем регистре, например edplink. Я считаю, что ваша переменная controls представляет собой набор элементов html, поэтому всякий раз, когда вам нужно искать в предварительно выбранной коллекции, используйте .filter().

Demo

Answer 2

Использование JQuery .append()

Использование .data() вместо .attr() HTML

<div class="button"></div> 


<div class="getVid" 
    data-epdLink="CdDDY5nVA3A" 
> 

JS

var endLink = $('.getVid').data('epdlink'); 

var fullLink = '<a href="https://www.youtube.com/watch?v=' + endLink +'">"Click for Video"</a>'; 

$('.button').append(fullLink) 

DEMO

В случае, если у вас есть несколько дивы

$('.getVid').each(function(i, v){ 
    var endLink = $(v).data('epdlink'); 
    var fullLink = '<a href="https://www.youtube.com/watch?v=' + endLink +'">"Click for Video"</a>'; 
$(v).prev('.button').append(fullLink) 
}) 

DEMO