JSFiddle - React, Tailwind, and code Playground

by Göran Andersson

HTML

<div id="blue"></div>
<div id="red"></div>
<div id="green"></div>
<div id="black"></div>
<div id="purple"></div>
<div id="orange"></div>

<button id="myButton">Click</button>

CSS

div{
    width: 50px;
    height: 50px;
    float: left; 
    margin-right: 5px;
}

#blue{ background: blue }
#red { background: red }
#green{ background: green }
#black{ background: black }
#purple{ background: purple }
#orange{ background: orange }

#myButton{ clear: left }

JavaScript

$(document).ready(function() {
    var $blue = $('#blue');
    var $red = $('#red');
    var $green = $('#green');
    var $black = $('#black');
    var $purple = $('#purple');
    var $orange = $('#orange');


    var myArray = [$blue, $red, $green, $black, $purple, $orange];

    $('#myButton').click(function() {
        $.each(myArray, function() {
            $(this).hide();
        });
     });


});