Can't Pass HTML Markup Through AJAX to PHP

Question

I have my html form sending data through AJAX to PHP. the form data contains a little HTML markup which I want to send to my PHP server.

My Form data is set up like so:

<form id="mail-formData">
    <input type="hidden" name="a" value="send-custom-mail">
    <input type="hidden" name="uid" id="cm-uid">
    <input type="text" class="form-control" id="cm-email2" name="to">
    <input type="text" class="form-control" name="message-subject" required>
    <textarea class="form-control" name="message-body" required></textarea>
    <button type="submit" class="btn btn-lg btn-primary sendMail">SEND MAIL</button>
</form>

NOTE: the content in my message-body contains markups like <b></b> and most especially <div style="">

My AJAX i well set up like so:

$.ajax({
    url: "send-mail.php",
    type: "POST",
    data: $("#mail-formData").serialize(),
    cache: false,
    success:function(response){
        console.log(response);
    }
});

and my send-mail.php is set up like so:

 if (isset($_POST['a'])&&$_POST['a']=='send-custom-mail') {
     die(var_dump($_POST));
 }

NOW,

1. When I send this request without the html markups in it, it works flawlessly

2. when I send with html markups like witouth the style="" it works.

BUT

Once I introduce style="color:red" it doesn't work. the form submits quite fine but I'm guessing without the data in serialize();

=========UPDATE========== Here are the screenshots from the response I got.

1. When sending with markups like etc:

2. When I add markup like :

Kindly note that the response below Image 2 is just the content of the page containing the form.