jQuery select a button using data-value attribute

Question

I am trying to select a button using the data-value attribute. I have set a variable for the data-value when I click a button. How do I further use it when I click it again to select the particular button?

HTML

    <button data-value="1" class="key">1
        <span>. , !</span>
    </button>
</td>
<td>
    <button data-value="2" class="key">2
        <span>a b c</span>
    </button>

JavaScript

$(document).ready(function(){
    $("#phone").find("button").mouseup(function(event){
        var button_pressed = $(event.currentTarget).data("value");
        $("#result").val(t9($("#result").val(),button_pressed));

    });
});

Answer 1

You can use jQueryUI's :data() selector for this:

$("#phone").find("button:data(value)").mouseup(...);

Note: Unless jQueryUI is already a dependancy, this is probably not what you need. Not worth it to include just for this selector. You can however, check and use the source for just this or write a custom selector perhaps.