无法使数据属性与jquery一起工作

我有三个按钮。当我按下按钮一时，x行应该切换，按钮二，y行切换等等…（使用html5的数据属性）。不幸的是，我无法做到这一点，因为我收到一个错误，说

type error:star.toggle（）不是函数

。我的代码如下：

<button class= "a" data-p="x"> Button one </button> 
<button class= "a" data-p="y"> Button two </button>
<button class= "a" data-p="z"> Button three </button>


<div class = "x"> Line x </div>
<div class = "y"> Line y </div>
<div class = "z"> Line z </div>

---

这就是你想做的

请参阅JSFIDLE：

---

当然因为代码试图通过标记查找元素。因此，我将其更改为查找类中的元素。我永远找不到“x”、“y”或“z”元素：）不客气。并考虑使用<代码> $.DATA < /C> >而不是<代码> $.Atf.。希望添加一个编辑。它确实适用于

$.data

和`$.attr`。很抱歉，我在重试时有一个小错误。所以这两种方法都是正确的。

$(document).ready(function() {
    $('.a').on('click', function(){
         var star= $(this).attr('data-p');
         (star).toggle();
    }); 
});

$(document).ready(function() {
    $('.a').on('click', function(){
         var star= $(this).data('p');
         $('.' + star).toggle();
    }); 
});