JSFiddle - React, Tailwind, and code Playground

by QW01_01

HTML

<div class="slider">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illo, aspernatur enim est, quisquam eveniet, explicabo doloremque sunt ut facilis id natus aliquam qui adipisci quia corporis nobis. Recusandae, harum et?</div>

JavaScript

'use strict';

class BaseDomWrapper{
	constructor(node){
        this._d = typeof node == "string" ? [].slice.call(document.querySelectorAll(node)) : node;
    }
    forEach(callBack){
        this._d.forEach(callBack);
    }
    hide(){
    	this.forEach(function(e){
            e.style.display = 'none';
        })
    }
    show(){
        this.forEach(function(e){
            e.style.removeProperty('display');
        })
    }
}

class Slider extends BaseDomWrapper{
	constructor(node){
        super(node);
        
        console.log(this._d);
    }
    makeRed(){
    	this.forEach(function(e){
            e.style.backgroundColor = 'red';
        })
    }
}

var sl = new Slider('div.slider');
sl.makeRed();