jQuery data() returns undefined constantly

http://stackoverflow.com/questions/16772977/jquery-data-returns-undefined-constantly

HTML

<span>
	<!-- ... -->
	<a href="link.html" class="textbutton"  data-conn="text3">
        <img src="/images/image.png" />
	</a>
</span>
<span style="width:610px;height:200px;float:right; background-color:#bcbcbc;font-size:15px;line-height:15px;">
	<div class="texts" id="text1">Initial Header</div>
	<span class="texts" id="text2" style="display:none;">Text for another one</span>
	<span class="texts" id="text3" style="display:none;">Content Text</span>
</span>

JavaScript

$(".textbutton").click(function(e) {
    e.preventDefault();
    var link = $(this).data("conn");
    $(".texts").fadeOut(1000, function() {
        $("#text2").fadeIn(1000);
    });
    console.log(link);
});