How can i add css with !important , only using jquery

jQuery code

var div = $(".my_class")
div.click(function() {
 div.style("color", "blue", "important")
        div.append("<div>Color: " + div.style('color') + "</div>")
 div.append("<div>Is_Important: " + div.style().getPropertyPriority('color') + "</div>")
})

$.fn.style = function(styleName, value, priority) {
    var node = this.get(0)
    if (typeof node == 'undefined') {
        return
    }
    var style = node.style
    if (typeof styleName != 'undefined') {
        if (typeof value != 'undefined') {
            var priority = typeof priority != 'undefined' ? priority : ''
            style.setProperty(styleName, value, priority)
        }
        else {
            return style.getPropertyValue(styleName)
        }
    } 
    else {
        return style
    }
}

And finally jsFiddle link

Click here to view effect

jQuery check if element has a specific style property defined inline

Here's a very simple (probably in much need of improvement) plugin I've thrown together that will get you the value of an inline style property (and return undefined if that property is not found):

​(function ($) {
    $.fn.inlineStyle = function (prop) {
         var styles = this.attr("style"),
             value;
         styles && styles.split(";").forEach(function (e) {
             var style = e.split(":");
             if ($.trim(style[0]) === prop) {
                 value = style[1];          
             }                   
         });  
         return value;
    };
}(jQuery));

You can call it like this:

//Returns value of "width" property or `undefined`
var width = $("#someElem").inlineStyle("width");



Or you can use more simple way to do this as:

if ( $("#someElem")[0].style["width"] ) {
    //Has the style property inline
}
else {
    //Has not the style property inline
}