How to get the Text() of different divs

How to get the Text() of different divs

Hello jQuery Community, my name is Ricardo, I'm from Perú and I'm starting to study javascript and jQuery...

I have this case:
1) There are 3 divs, each div contains "an <h2> tag" and "an input class='button' ".
2) I want an alert that displays the text in the h2, when I click the Input contained within its div parent.
<body>
    <div>
        <h2>I'm First!</h2>
        <input type="button" class="button" value="First Button" />
    </div>
    <div>
        <h2>I'm Second!</h2>
        <input type="button" class="button" value="Second Button" />
    </div>
    <div>
        <h2>I'm Third!</h2>
        <input type="button" class="button" value="Third Button" />
    </div>
</body>












My logic is to traverse to the input's parent and then find the h2 children, but something is wrong...
Can I get some support please?


(function(){
        $(document).ready(function(){
            $('.button').click(function(){
                var hTwoText = $('.button').parent().find('h2').text(this);       
                alert(hTwoText);
            });
        });
    })(jQuery);






Thanks in advance!