Get the selected radio input value with PHP and jQuery Ajax

HTML

<form action="" method="POST" id="demoForm">

<div class="demo-container">
<div class="demo-radio-buttons-container">
<input type="radio" name="color" id="blue" value="blue">
<label for="blue"><span>Blue</span></label>

<input type="radio" name="color" id="green" value="green">
<label for="green"><span>Green</span></label>

<input type="radio" name="color" id="orange" value="orange">
<label for="orange"><span>Orange</span></label>

<input type="radio" name="color" id="pink" value="pink">
<label for="pink"><span>Pink</span></label> 

</div>
</div> 
<div class="container-fluid">
<div class="row justify-content-between">
<div class="col-md-8">
<div id="message"></div>
</div>
<div class="col-md-4">
<div class="submit-button-container">
<input name="submit" type="submit" value="Submit" class="btn btn-primary">
</div>
</div>
<p class="p2"></p>
</div>
</div> 

</form>

$(function () {
$("#message").html("What is your favourite color");
$('#demoForm').on('submit', function (event) {
$.ajax({
type: 'post',
url: 'post.php',
data: $('form').serialize(),
success: function (data) {
$("#message").html(data);
}
});
event.preventDefault();
});
});

PHP

<?php
if(!empty($_POST["color"])) {
echo "Your favourite color is <strong><span style='color: ". $_POST["color"]."'>".$_POST["color"]."</span></strong>";
} 
else {
echo "Please select a color ";
}
?>