JSFiddle - React, Tailwind, and code Playground

by jackrugile

HTML

<script src="http://jackrugile.com/jrumble/js/jrumble.1.1.min.js"></script>
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>

<a href="#" id="stop1">Stop div1</a>
<br />
<a href="#" id="stop2">Stop div2</a>
<br />
<a href="#" id="stop3">Stop div3</a>

CSS

div {
    background: #333;
    float: left;
    margin-right: 20px;
    width: 100px;
    height: 100px;
}

JavaScript

$(document).ready(function(){    
    $('.div1, .div2, .div3').jrumble({rumbleEvent:'click'});
    $('.div1, .div2, .div3').trigger('click');
    
    $('#stop1').click(function(){
        $('.div1').trigger('click');
        return false;
    }); 
    
    $('#stop2').click(function(){
        $('.div2').trigger('click');
        return false;
    });
    
    $('#stop3').click(function(){
        $('.div3').trigger('click');
        return false;
    });    
});