JSFiddle - React, Tailwind, and code Playground

HTML

<div id="nc_wrap2">

<a class="nc1" href="#">Link 1</a>
<a class="nc2" href="#">Link 2</a>
<a class="nc3" href="#">Link 3</a>
<a class="nc4" href="#">Link 4</a>
<a class="nc5" href="#">Link 5</a>

</div>  
<div id="CONTENT">My content needs to change here.</div>

JavaScript

$( 'a' ).mouseover( function(){
    switch( $( this ).attr( 'class' ) )
    {
        case 'nc1':
            new_content = 'whatever you want';
            break;
            
        case 'nc2':
            new_content = '<img src="http://www.bestweekever.tv/bwe/images/2010/07/bacon2.jpg">';
            break;
            
        default:
            new_content = 'everything else. I got lazy';
            break;
    }
    
  $( '#CONTENT' ).html( new_content )  
})
    .mouseout( function(){
  $( '#CONTENT' ).text( ' My content needs to change here.')
})