получить доступ к нескольким атрибутам данных HTML с помощью jQuery 'this'

Question

Хорошо, название может быть немного запутанным. Позвольте мне объяснить.

<div class="book">
    <h3>Name of Book</h3>
    <p>
        <span data-notmobile="Author"></span>Rajesh K. Maurya</p>
    <p>
        <span data-notmobile="Publication"></span>Wiley India</p>
    <p>
        <span data-notmobile="Edition"></span>2011</p>
    <p>
        <span data-notmobile="Branch"></span>Information Technology</p>
    <p>
        <span data-notmobile="Semester"></span>5</p>
</div>

Теперь я хочу обменяться содержимым каждого диапазона с его атрибутом данных соответственно. Я пытался

$('.book span').html($('.book span').data("notmobile"));

, который изменяет только внутренний html на первый атрибут, то есть «Автор». По какой-то причине ключевое слово this не работает.

Я хочу сделать это, не давая каждому диапазону свой класс.

Answer 1

$('.book span').each(function(){
    $(this).html($(this).data("notmobile"));
});

LIVE DEMO

Answer 2

$('.book span').data('notmobile') возвращает значение первого соответствующего элемента.Используйте следующий код, чтобы получить правильный желаемый эффект:

Демо: http://jsfiddle.net/Gezxj/

$('.book span').html(function() {
    return $(this).data("notmobile");
});

Answer 3

$('.book span').each(function() {
    var $this = $(this);
    $this.html($this.data('notmobile')); 
});