Solución:
Yo iría con ese código:
var oBox = $("#blackbox");
var curClass = oBox.attr("class");
var newClass = (curClass == "bg_black") ? "bg_pink" : "bg_black";
oBox.removeClass().addClass(newClass);
Para que funcione, primero debe cambiar su CSS y eliminar el background desde el #blackbox declaración, agregue esas dos clases:
.bg_black { background-color: #000; }
.bg_pink { background-color: pink; }
Y asigna la clase bg_black al blackbox elemento inicialmente.
JsFiddle actualizado: http://jsfiddle.net/6nar4/17/
En mi opinión, es más legible que las otras respuestas, pero depende de usted elegir, por supuesto.
Creo que Dan y Nicola tienen un código corregido adecuado, sin embargo, es posible que no tenga claro por qué el código original no funcionó.
Lo que se ha denominado aquí un “operador ternario” se denomina operador condicional en ECMA-262 sección 11.12. Tiene la forma:
LogicalORExpression ? AssignmentExpression : AssignmentExpression
La LogicalORExpression se evalúa y el valor devuelto se convierte a booleano (como una expresión en una condición if). Si se evalúa como verdadero, entonces se evalúa la primera AssignmentExpression y se devuelve el valor devuelto; de lo contrario, se evalúa y se devuelve el segundo.
El error en el código original son los puntos y coma adicionales que cambian el operador condicional que se intentó en una serie de declaraciones con errores de sintaxis.
Yo haría (almacenamiento en caché agregado):
var bbx = $("#blackbox");
bbx.css('background-color') === 'rgb(255, 192, 203)' ? bbx.css('background','black') : bbx.css('background','pink')
violín de trabajo (nuevo OTRA VEZ): http://jsfiddle.net/6nar4/37/
Tuve que cambiar el primer operador como css() devuelve el valor rgb del color