Javascript cambiar el estilo Div

Question

Quiero que part 1 onclick div cambie de estilo y part 2 nuevamente al hacer clic en él vuelve a la normalidad. Intenté hacerlo pero no logré los resultados part 2.

A continuación se presenta el código Javascript

function abc() { 
    document.getElementById("test").style.color="red"; 
} 

Después de hacer clic en el div prueba de nuevo, el color debe volver a defaulr de color negro ... es decir

Answer 1

function abc() { 
    var color = document.getElementById("test").style.color; 
    if (color === "red") 
     document.getElementById("test").style.color="black"; 
    else 
     document.getElementById("test").style.color="red"; 
} 

Answer 2

puede comprobar el color antes de hacer clic para cambiarlo

function abc(){ 
    var color = document.getElementById("test").style.color; 
    if(color==''){ 
     //change 
    }else{ 
     //change back 
    } 
} 

Answer 3

Tiene alguna lógica para comprobar el color o tienen alguna bandera,

function abc() { 
    var currentColor = document.getElementById("test").style.color; 

    if(currentColor == 'red'){ 
    document.getElementById("test").style.color="black"; 
    }else{ 
    document.getElementById("test").style.color="red"; 

    } 
} 

Answer 4

Una declaración simple interruptor debe hacer el truco:

function abc() { 
    var elem=document.getElementById('test'),color; 
    switch(elem.style.color) { 
     case('red'): 
      color='black'; 
      break; 
     case('black'): 
     default: 
      color='red'; 
    } 
    elem.style.color=color; 
} 

Answer 5

function abc() { 
    var color = document.getElementById("test").style.color; 
    color = (color=="red") ? "black" : "red" ; 
    document.getElementById("test").style.color= color; 
} 

Answer 6

mejor cambiar la clase de el elemento (.regular es negro, .alert es rojo):

function abc(){ 
    var myDiv = document.getElementById("test"); 
    if (myDiv.className == 'alert') { 
    myDiv.className = 'regular'; 
    } else { 
    myDiv.className = 'alert'; 
    } 
} 

Answer 7

Usando jQuery:

$(document).ready(function(){ 
    $('div').click(function(){ 
     $(this).toggleClass('clicked'); 
    }); 
});​ 

Live example