Q:

Set -webkit-transform and transform using JS

I am trying to change "transform" css property of element, using jQuery:
myBlock.css('-webkit-transform', 'rotate(' + angle + 'deg)');
myBlock.css('-moz-transform', 'rotate(' + angle + 'deg)');
myBlock.css('-ms-transform', 'rotate(' + angle + 'deg)');
myBlock.css('-o-transform', 'rotate(' + angle + 'deg)');
myBlock.css('transform', 'rotate(' + angle + 'deg)');

I want to see all of these properties applied to element, but the result is only
transform: rotate(45ged);

I tried JavaScript style, but it does not help too:
myBlock.style.WebkitTransform = "rotate(" + angle + "deg)";

Applied style is the same, as in previous example.
I found information, that modern jQuery versions (from 1.8) remove prefixes automatically. But why JS-style removes vendor properties?
To write all of these in one "attr('style', 'properties')" string is not a solution, because in this case it removes existing styles.
So the question is: how to apply all transform properties, using JS or jQuery?
Thanks for any help.
Edit: the goal is to have prefixed properties in saved html after executing JS command, not just to execute JS command and rotate div on angle's value.

A:

So, I have not found any good solution, except to modify "style" string. Here is it:
myBlock.css('transform', 'rotate(' + angle + 'deg)');
// Fix for old android versions:
var blockStyle = myBlock.attr('style');
if (blockStyle.indexOf('-webkit-transform') === -1) {
    blockStyle += " -webkit-transform: rotate(" + angle + "deg);";
}
myBlock.attr('style', blockStyle);

The first line of code overwrites all transform properties, including prefixed. After its execution there will be no -webkit-transform part in style string. Then we add it.
In case of there still will be -webkit-transform in style string somehow after the first command (for me it never happen in modern Chrome, Firefox and Edge), I have else statement, a little bit ugly, but it works.
var blockStyle = myBlock.attr('style');
if (blockStyle.indexOf('-webkit-transform') === -1) {
    blockStyle += " -webkit-transform: rotate(" + angle + "deg);";
} else {
    var blockStyleArrayOriginal = blockStyle.split('-webkit-transform: rotate(');
    blockStyle = blockStyleArrayOriginal[0].trim() + " -webkit-transform: rotate(" + angle + blockStyleArrayOriginal[1].substring(blockStyleArrayOriginal[1].indexOf('deg)'));
}
myBlock.attr('style', blockStyle);

