Remove add/remove class methods,

Remove helper set/get css methods

IPython/html/static/widgets/js/widget.js

@@ -413,31 +413,13 b' define(["widgets/js/manager",'
                 this.update_visible(this.model, this.model.get("visible"));
                 this.update_css(this.model, this.model.get("_css"));
             }, this);
-            this.model.on('msg:custom', this.on_msg, this);
             this.model.on('change:visible', this.update_visible, this);
             this.model.on('change:_css', this.update_css, this);
-        },
-
-        on_msg: function(msg) {
-            // Handle DOM specific msgs.
-            switch(msg.msg_type) {
-                case 'add_class':
-                    this.add_class(msg.selector, msg.class_list);
-                    break;
-                case 'remove_class':
-                    this.remove_class(msg.selector, msg.class_list);
-                    break;
-            }
-        },
-
-        add_class: function (selector, class_list) {
-            // Add a DOM class to an element.
-            this._get_selector_element(selector).addClass(class_list);
-        },
-
-        remove_class: function (selector, class_list) {
-            // Remove a DOM class from an element.
-            this._get_selector_element(selector).removeClass(class_list);
+            this.model.on('change:_dom_classes', function(model, new_classes) {
+                var old_classes = model.previous('children');
+                this.update_classes(old_classes, new_classes);
+            }, this);
+            this.update_classes([], this.model.get('_dom_classes'));
         },
 
         update_visible: function(model, value) {
@@ -461,6 +443,15 b' define(["widgets/js/manager",'
             }
         },
 
+        update_classes: function (old_classes, new_classes) {
+            // Update the DOM classes applied to the topmost element.
+            this.do_diff(old_classes, new_classes, function(removed) {
+                this.$el.removeClass(removed);
+            }, function(added) {
+                this.$el.addClass(added);
+            });
+        },
+
         _get_selector_element: function (selector) {
             // Get the elements via the css selector.
             var elements;

IPython/html/widgets/widget.py

@@ -379,100 +379,5 b' class Widget(LoggingConfigurable):'
 
 class DOMWidget(Widget):
     visible = Bool(True, help="Whether the widget is visible.", sync=True)
-    _css = List(sync=True) # Internal CSS property list: (selector, key, value)
-
-    def get_css(self, key, selector=""):
-        """Get a CSS property of the widget.
-
-        Note: This function does not actually request the CSS from the 
-        front-end;  Only properties that have been set with set_css can be read.
-
-        Parameters
-        ----------
-        key: unicode
-            CSS key
-        selector: unicode (optional)
-            JQuery selector used when the CSS key/value was set.
-        """
-        if selector in self._css and key in self._css[selector]:
-            return self._css[selector][key]
-        else:
-            return None
-
-    def set_css(self, dict_or_key, value=None, selector=''):
-        """Set one or more CSS properties of the widget.
-
-        This function has two signatures:
-        - set_css(css_dict, selector='')
-        - set_css(key, value, selector='')
-
-        Parameters
-        ----------
-        css_dict : dict
-            CSS key/value pairs to apply
-        key: unicode
-            CSS key
-        value:
-            CSS value
-        selector: unicode (optional, kwarg only)
-            JQuery selector to use to apply the CSS key/value.  If no selector 
-            is provided, an empty selector is used.  An empty selector makes the 
-            front-end try to apply the css to a default element.  The default
-            element is an attribute unique to each view, which is a DOM element
-            of the view that should be styled with common CSS (see 
-            `$el_to_style` in the Javascript code).
-        """
-        if value is None:
-            css_dict = dict_or_key
-        else:
-            css_dict = {dict_or_key: value}
-        
-        for (key, value) in css_dict.items():
-            # First remove the selector/key pair from the css list if it exists.
-            # Then add the selector/key pair and new value to the bottom of the 
-            # list.
-            self._css = [x for x in self._css if not (x[0]==selector and x[1]==key)]
-            self._css += [(selector, key, value)]
-        self.send_state('_css')
-
-    def add_class(self, class_names, selector=""):
-        """Add class[es] to a DOM element.
-
-        Parameters
-        ----------
-        class_names: unicode or list
-            Class name(s) to add to the DOM element(s).
-        selector: unicode (optional)
-            JQuery selector to select the DOM element(s) that the class(es) will
-            be added to.
-        """
-        class_list = class_names
-        if isinstance(class_list, (list, tuple)):
-            class_list = ' '.join(class_list)
-
-        self.send({
-            "msg_type"   : "add_class",
-            "class_list" : class_list,
-            "selector"   : selector
-        })
-
-    def remove_class(self, class_names, selector=""):
-        """Remove class[es] from a DOM element.
-
-        Parameters
-        ----------
-        class_names: unicode or list
-            Class name(s) to remove from  the DOM element(s).
-        selector: unicode (optional)
-            JQuery selector to select the DOM element(s) that the class(es) will
-            be removed from.
-        """
-        class_list = class_names
-        if isinstance(class_list, (list, tuple)):
-            class_list = ' '.join(class_list)
-
-        self.send({
-            "msg_type"   : "remove_class",
-            "class_list" : class_list,
-            "selector"   : selector,
-        })
+    _css = CTuple(sync=True, help="CSS property list: (selector, key, value)")
+    _dom_classes = CTuple(sync=True, help="DOM classes applied to widget.$el.")