Same Button Remove

I am trying to remove same button matching pairs using the code below but i am not not successful. As they are two button1 and button3 so if i click the matching pair button 1 and button 1 both should remove with score as 1. i.e., for every succesful pair score is incremented by 1.

<div id="score">Score: 0</div>
<button id="one" type="button" data-index="0">Button1</button>
<button id="two" type="button" data-index="0">Button1</button>
<button id="three" type="button" data-index="1">Button3</button>
<button id="four" type="button" data-index="1">Button3</button>

<script>

var Score = 0;
    index = 0;
   
$("#one, #two, #three, #four").click(function () {
   
    var dataIndex = $(this).data('index');
    if (index == dataIndex) {
        Score++;
        $(this).hide();
        if(dataIndex == 1) {
            index = 0;
        } else {
           index++;  
        }
    } 

    $("#score").html("Score: " + Score);
});
</script>

Code (markup):

 

First of all you have to store your score as data-id in the div, because when you click second time it gets score as 0(Zero) so when you increment it, than first get from the data-is and then update the same.

Second thing is that, You don't need to check each id, Just use like this $('button[data-index="'+dataIndex+'"]').hide();

So, Button with same data-index will be hidden.