change jquery mobile color swatch dynamically

Question

I want to change a jquery-mobile buttons color swatch dynamically with javascript, but I can\'t\' find a way (except removing and adding all classes and event handlers, but

Answer 1

Yes, looks like there is no way to simply change the theme swatch.

I hacked a simple function to exchange the color by regex:

$.fn.changeColorSwatch = function(theme, type) {
  if (!type) {
    type = 'theme';
  }
  var currentTheme = this.attr('data-' + type);
  if (!currentTheme) {
    currentTheme = 'c';
  }
  this.attr('data-' + type, theme);
  var regex = new RegExp('^ui-(.*)-' + currentTheme + '$');
  var classes = $.extend({}, this[0].classList);
  var i = classes.length;
  while (i--) {
    var match = classes[i].match(regex);
    if (match) {
      this.removeClass(match[0]);
      this.addClass('ui-' + match[1] + '-' + theme);
    }
  }
};

I know, it should use jqmData instead of attr, but the data-theme attribute wasn't changed properly.