JSFiddle - React, Tailwind, and code Playground

by jpwo759

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="dd">
</select>

CSS

.hidden
{
  display:none;
}

JavaScript

var AllOperators = [{"Name":"equals","Symbol":"==","NoValue":false,"SupportedFieldTypes":[5,16,15,8,7,4,6,1,3,9]},{"Name":"does not equal","Symbol":"!=","NoValue":false,"SupportedFieldTypes":[5,16,15,8,7,4,6,1,3,9]},{"Name":"less than","Symbol":"\u003c","NoValue":false,"SupportedFieldTypes":[8,7,9]},{"Name":"less and equal than","Symbol":"\u003c=","NoValue":false,"SupportedFieldTypes":[8,7,9]},{"Name":"greater than","Symbol":"\u003e","NoValue":false,"SupportedFieldTypes":[8,7,9]},{"Name":"greater and equal than","Symbol":"\u003e=","NoValue":false,"SupportedFieldTypes":[8,7,9]},{"Name":"in","Symbol":"in","NoValue":false,"SupportedFieldTypes":[5,16,15,8,7,4,6,1,3,9]},{"Name":"not in","Symbol":"not in","NoValue":false,"SupportedFieldTypes":[5,16,15,8,7,4,6,1,3,9]},{"Name":"is changed","Symbol":"is changed","NoValue":true,"SupportedFieldTypes":[5,16,8,7,4,6,1,9]},{"Name":"is clicked","Symbol":"is clicked","NoValue":true,"SupportedFieldTypes":[10]}];

var selectedFieldType = 3;

 var supportedOperators = AllOperators.filter(function(opt){return !!~opt.SupportedFieldTypes.indexOf(selectedFieldType);});
 
 var whatIsThis = supportedOperators.map(
 	   function(opt){ 
     			return new Option(opt.Name,opt.Symbol,false,false);
     });
 
 console.log(supportedOperators);
 console.log(whatIsThis);