JSFiddle - React, Tailwind, and code Playground

by Dhanck

HTML

<div class="col-md-2 aligner">
<div class="row">
    
    <select id="selectMain" name="selectbasic" class="form-control">
      <option value="1">Match All</option>
      <option value="2">Match Any</option>
      <option value="2">Match None</option>
    </select>
     <span class="bracketBorders">{</span>
  </div>
   
</div>



<div class="col-md-10">
<div class="row">
    <span class="glyphicon glyphicon-minus-sign minus"></span>
<div class="col-md-2">
    <select id="selectbasic" name="selectbasic" class="form-control">
      <option value="1">Option one</option>
      <option value="2">Option two</option>
    </select>
  </div>
<div class="col-md-2">
    <select id="selectbasic" name="selectbasic" class="form-control">
      <option value="1">Option one</option>
      <option value="2">Option two</option>
    </select>
  </div>
<div class="col-md-2">
    <select id="selectbasic" name="selectbasic" class="form-control">
      <option value="1">Option one</option>
      <option value="2">Option two</option>
    </select>
  </div>
<a href="#" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-calendar"></span> </a>
</div>

<div class="row row2">
      <span class="glyphicon glyphicon-plus-sign plus"></span>
    <div class="col-md-2">
  
<a href="#" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-plus"></span> </a>
    </div>
</div>
</div>

CSS

body{
    margin:30px;
}
.row2{
    margin-top:10px;
}
.plus{
    font-size:18px;
    color:green;
    float:left;
    margin-top: 4px;
}
.minus{
    font-size:18px;
    color:red;
    float:left;
    margin-top: 4px;
}
.aligner{
    margin-top: 20px;
  
}
.bracketBorders {
       float: right;
    font-size: 82px;
    margin-top: -82px;
}
.selectMain{
    float:left;
    width:100px!important;
}
.form-control {
    width: 85%;
}
select{
    padding:0!important;
}

JavaScript

$(".plus").on('click', function() {
    var $newRow    = $(this).closest('.row');
    var $clone = $newRow.clone();
    $clone.find(':text').val('');
    $newRow.after($clone);
});