JSFiddle - React, Tailwind, and code Playground

by lollero

HTML

<div>True:</div>
<p>False:</p>

CSS

div, p {
    height: 20px;
    background: #f9f9f9;
    border: 1px solid #999999;
    margin: 20px;
    padding: 5px;
}

p { color: red; }

JavaScript

$(document).ready(function() {
        $('div').test({

        });
    });


(function($){
    $.fn.extend({
        test: function(options) {

            var defaults = {
                numbers: [ "three", "one" ], // for some reason these are all -1
                color: 'green'
            };

            var options = $.extend(defaults, options);
         
            return this.each(function() {
                  var o = options;
                  var obj = $(this);

                    if ( o.color != null ) {
                        obj.css({ color: o.color });
                    }

                    if ( jQuery.inArray("one", o.numbers) == -1  ){
                        obj.next().html( obj.next().html() + ' (One '+ jQuery.inArray("one", o.numbers) +') ' );
                    }                
                    else if ( jQuery.inArray("one", o.numbers) != -1 ){
                        obj.html( obj.html() + ' (One '+ jQuery.inArray("one", o.numbers) +') ' );
                    }

                    if ( jQuery.inArray("two", o.numbers) == -1  ){
                        obj.next().html( obj.next().html() + ' (Two '+ jQuery.inArray("two", o.numbers) +') ' );
                    }               
                    else if ( jQuery.inArray("two", o.numbers) != -1 ){
                        obj.html( obj.html() + ' (Two '+ jQuery.inArray("two", o.numbers) +') ' );
                    }

                    if ( jQuery.inArray("three", o.numbers) == -1  ){
                        obj.next().html( obj.next().html() + ' (Three '+ jQuery.inArray("three", o.numbers) +') ' );
                    }                
                    else if ( jQuery.inArray("three", o.numbers) != -1 ){
                        obj.html( obj.html() + ' (Three '+ jQuery.inArray("three", o.numbers) +') ' );
                    }

                    if ( jQuery.inArray("four", o.numbers) == -1  ){
                        obj.next().html( obj.next().html() + ' (Four '+...