JSFiddle - React, Tailwind, and code Playground

by stevenkaspar

HTML

<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<!-- List 1 -->
<ul class="list-A">                 
    <li class="orderCntrl-6062347" data-news-target='#news1'><h2 class="newsTitle">Item One</h2></li>                  
    <li class="orderCntrl-6062348" data-news-target='#news2'><h2 class="newsTitle">Item Two</h2></li>
    <li class="orderCntrl-6062349" data-news-target='#news3'><h2 class="newsTitle">Item Three</h2></li> 
</ul>
<hr/>
<!-- List B -->
<div class="list-B">                 
    <div id='news1'>NEWS One</div>                  
    <div id='news2'>NEWS Two</div>
    <div id='news3'>NEWS Three</div> 
</div>


<script>           
    $("[data-news-target]").click(function() {      
    
        $(this).parent().prepend($(this));    
        
        var target_element = $( $(this).data('newsTarget') );
        $( target_element ).parent().prepend( target_element );              
    });
</script>