JQuery, передающий элемент id для события toggle

Question

Я пытаюсь передать данные атрибута div как идентификатор элемента. У меня есть группа divs в паре, первая - как своего рода заголовок, определяющий, что во втором, невидимом div. Я пытаюсь переключить второй div, видимый с помощью события mouseenter первого. Я пытаюсь сделать это с помощью одной функции для всей группы, а не для каждой пары.

Мой код следующим образом:

$(document).ready(function() { 
 
    $('div.jobs').mouseenter(function() { 
 
     var id = (this).attr("data-item"); 
 
     $($("#"+ id).toggle()); 
 
    }); 
 
});

HTML следующим образом:

<div class="jobs" id="ident" data-item="data"> test div</div> 
<br /> 
<div class="jobs" id="data" style="display:none">Some Data</div> 
<br /> 
<div class="jobs" id="ident1" data-item="data1"> test div 2</div> 
<br /> 
<div class="jobs" id="data1" style="display:none">Some Other Data</div> 
<br /> 

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

Answer 1

Посмотрите на эту скрипку:

http://jsfiddle.net/z26ogdzq/

Я сделал некоторые незначительные изменения в исходный в JS.

$(document).ready(function() { 
 
    $('div.jobs').mouseenter(function() { 
 
     var id = $(this).attr("data-item"); 
 
     $("#" + id).toggle(); 
 
    }); 
 
});

Answer 2

вы забыли положить $. попробуйте

var id = $(this).attr("data-item");