Una de las múltiples tareas operadas por botón no se ejecutará

Tengo problemas con una de las múltiples tareas que se ejecutan con un botón. El botón ejecuta dos de las tres tareas (las oculta en .(click) ), excepto la última, una función de javascript que parpadea. ¡No puedo ver lo que puede estar mal! La misma syntax para ocultar el texto antes de que sea la misma syntax utilizada para ocultar el siguiente, pero por alguna razón no lo ocultará (el texto parpadeante). ¡Gracias de antemano por tu ayuda!

Aquí está mi código:

     body { background-color: coral; color: white; } .text1{ padding-left: 15px; color: white; font-family: 'Orbitron', sans-serif; width: 250px; float: left; padding-top: 10px; } .text2{ color: white; width: 100px; float: right; padding-top: 10px; }     $(document).ready(function(){ $(".btn1").on('click',function(){ $("p").hide(); $(".text1").hide(); $(".text2").hide(); $('body').css("background", "black"); }); var element = $(".text2"); var shown = true; setInterval(toggle, 500); function toggle() { if(shown) { element.hide(); } else { element.show(); } shown = !shown; } });    
PRESS BUTTONS BELOW
-- : --

Para ocultar .text2 borre el setInterval usando clearInterval

 $(document).ready(function() { $(".btn1").on('click', function() { $("p").hide(); $(".text1").hide(); $(".text2").hide(function() { clearInterval(x) }); $('body').css("background", "black"); }); var element = $(".text2"); var shown = true; var x = setInterval(toggle, 500); function toggle() { if (shown) { element.hide(); } else { element.show(); } shown = !shown; } }); 
 body { background-color: coral; color: white; } .text1 { padding-left: 15px; color: white; font-family: 'Orbitron', sans-serif; width: 250px; float: left; padding-top: 10px; } .text2 { color: white; width: 100px; float: right; padding-top: 10px; } 
  
PRESS BUTTONS BELOW
-- : --