JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="cpvote">
<li id="test1">Message 1</li>
<li id="test2">Message 2</li>
<li id="test3">Message 3</li>
<li id="new_test1" style="display:none">Message 4</li>
<li id="new_test2" style="display:none">Message 5</li>
</ul>

<ul id="cpvote">
<li id="test1">Message 1</li>
<li id="test2">Message 2</li>
<li id="test3">Message 3</li>
<li id="new_test1" style="display:none">Message 4</li>
<li id="new_test2" style="display:none">Message 5</li>
</ul>

<ul id="cpvote">
<li id="test1">Message 1</li>
<li id="test2">Message 2</li>
<li id="test3">Message 3</li>

<li id="new_test1" style="display:none">Message 4</li>
<li id="new_test2" style="display:none">Message 5</li>
</ul>

JavaScript

$( document ).ready(function() {

    // putting extra unique attributes in UL to Identified.

    $("UL").each(function(i){
        $("UL").eq(i).attr('ul-id','ul-'+i);    
    });

    $("UL").each(function(i){
        $("UL[ul-id='ul-"+i+"']").find("LI").on("click",function(){
           $("UL[ul-id='ul-"+i+"']").find("#new_"+$(this).attr('id')).show();
        });
    });
});