JSFiddle - React, Tailwind, and code Playground

JavaScript

var upper = 10;
var set1 = [3,4,5,7,9,10];
var set2 = [1,5,9,10,2];
var set3 = [5,7,3];

z=document;
function t(e,c){e.innerHTML+=' '+c;}

z.body.innerHTML += "<style>div{border:1px solid;text-align:center;vertical-align:middle}.s{position:absolute;width:50%;height:50%;border-radius:50%;line-height:200px;}#m{position:relative;width:400px;height:400px} #s1{left:25%;top:30px;background:rgba(255,0,0,0.4)} #s2{left:30px;bottom:30px;background:rgba(0,255,0,0.4)} #s3{right:30px;bottom:30px;background:rgba(0,0,255,0.4)} .v{position:absolute;width:10%;height:10%;line-height:40px;border:none} #s123{left:45%;top:48%} #s12{left:30%;top:40%;} #s13{right:30%;top:40%} #s23{left:45%;bottom:25%}</style><div id=m><div id=s1 class=s>@<div id=s2 class=s>@<div id=s3 class=s>@<div id=s123 class=v>@<div id=s12 class=v>@<div id=s13 class=v>@<div id=s23 class=v>@@".replace(/@/g, "</div>");

for(i=0;i<=upper;i++){
    in1=in2=in3=false;
    if(set1.indexOf(i) != -1)
        in1 = true;
    if(set2.indexOf(i) != -1)
        in2 = true;
    if(set3.indexOf(i) != -1)
        in3 = true;
    
    if(in1 && in2 && in3)
        t(s123, i);
    else if(in1 && in2)
        t(s12, i);
    else if(in1 && in3)
        t(s13, i);
    else if(in2 && in3)
        t(s23, i);
    else if(in1)
        t(s1, i);
    else if(in2)
        t(s2, i);
    else if(in3)
        t(s3, i);
    else
        t(m, i);
}