No Github do [daneden][1] ensina como fazer isso usando jQuery.


**Exemplo:**

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    $.fn.extend({
      animateCss: function(animationName) {
        var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';
        this.addClass('animated ' + animationName).one(animationEnd, function() {
          $(this).removeClass('animated ' + animationName);
        });
        return this;
      }
    });

    /*  
    setInterval(function() {
      $('.p1').animateCss('bounce');
      $('.p2').animateCss('pulse');
    }, 3000);
    */
    $(".p2").addClass('hide');

    $(".btnFlip").click(function () {
      $('.p1').toggleClass('hide').animateCss('flipOutX');
      $('.p2').toggleClass('hide').animateCss('flipInX');
    });

<!-- language: lang-css -->

    .hide{
     display: none;
    }

<!-- language: lang-html -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css" rel="stylesheet" />

    <p class="p1">Click me away!</p>
    <p class="p2">Click me too!</p>
    <br>

    <button class="btnFlip">Click</button>

<!-- end snippet -->

Você pode criar uma function do jQuery para simplificar todo o processo, nesta do exemplo `animateCss()` recebe o nome do efeito como parâmetro. Por dentro da function ela aguarda toda a animação acabar para remover as propriedades da mesma e assim rodar novamente.


Você pode definir também um `setInterval()` para disparar a animação de tempos em tempos.

  [1]: https://github.com/daneden/animate.css