JQuery: variabele wordt niet meegegeven in ajax call

Ik heb een link die er zo uit ziet:

<a href="#" data-href="<?php echo $row["id"]; ?>" class="delbericht"><img src="images/icons/delete.png" width="20px" class="delete" /></a>

Ik heb via het bronbestand van de browser gekeken en ik zie dat de data-href value gevuld is met een id.

Vervolgens wil ik die variabele gebruiken in een ajax call alleen geeft hij steeds aan dat deze leeg is.
Wie weet waarom hij denkt dat deze variabele leeg is?

$(".delbericht").click(function(e){
			e.preventDefault();
			href=$(this).data("href");
			swal({
				title: "Weet je het zeker?",
				text: "Dit bericht wordt permanent verwijderd",
				type: "warning",
				showCancelButton: true,
				closeOnConfirm: false,
				showLoaderOnConfirm: true,
			}, 
			function() {
				$.ajax({
					type: "POST",
					url: "scripts/jquery-posts.php",
					data: 'delbericht=' + href,
					success: function(msg){		
						setTimeout(function(){
							swal("Bericht succesvol verwijderd");
						}, 2000); 
					},
					error: function(msg){		
						setTimeout(function(){
							swal("Error: kan bericht niet verwijderen");
						}, 2000); 
					}
				}); // Ajax Call
			});
		});