JSFiddle - React, Tailwind, and code Playground
HTML
<button id="execB">execB</button>
<ul class="myUl">
<li>(UK/IRE, POL)</li>
<li>(UK/IRE)</li>
<li>(POL)</li>
<li>(SAN)</li>
<li>(GER, POL)</li>
<li>(GER)</li>
<li>(SAN, UK/IRE)</li>
</ul>
<div id="gerDiv" class="holders"><p>german div:</p><ul></ul></div>
<div id="ukDiv" class="holders"><p>uk/ire div:</p><ul></ul></div>
<div id="polDiv" class="holders"><p>pol div:</p><ul></ul></div>
<div id="sanDiv" class="holders"><p>san div:</p><ul></ul></div>
CSS
.holders{
background: gray;
width: 100px;
height: 200px;
margin-left: 15px;
margin-bottom: 15px;
float: left;
}
JavaScript
$(document).ready(function(){
$('#execB').click(function(){
var polStr = "";
var ukStr = "";
var gerStr = "";
var sanStr = "";
$('.myUl li').each(function(){
var liText = $(this).text().toLowerCase();
var newliText = liText.replace(/[{()}]/g, "");
var textArray = newliText.split(/[,]/);
console.log(textArray);
$(textArray).each(function(index){
switch(true){
case (textArray[index].indexOf('pol') != -1):
polStr = polStr + liText+"<br>";
break;
case (textArray[index].indexOf('uk') != -1)
|| (textArray[index].indexOf('ire') != -1):
ukStr = ukStr + liText+"<br>";
break;
case (textArray[index].indexOf('ger') != -1):
gerStr = gerStr + liText+"<br>";
break;
case (textArray[index].indexOf('san') != -1):
sanStr = sanStr + liText+"<br>";
break;
}
});
});
if (polStr) {
$('#polDiv').append(polStr+"<br>");
}
if (ukStr) {
$('#ukDiv').append(ukStr+"<br>");
}
if (gerStr) {
$('#gerDiv').append(gerStr+"<br>");
}
if (sanStr) {
$('#sanDiv').append(sanStr+"<br>");
}
});
});