JSFiddle - React, Tailwind, and code Playground

by Ehsan Sajjad

HTML

<div id="bigimage_container"></div>
        <div id='carousel_container'>
          <div id='left_scroll'><img src='' /></div>
            <div id='carousel_inner'>
                <ul id='carousel_ul'>
                    <li><a href='#'><img style="display:none;" src='http://i.stack.imgur.com/um1Bo.jpg?s=128&g=1' /></a></li>
                    <li><a href='#'><img src='2.png' /></a></li>
                    <li><a href='#'><img src='3.png' /></a></li>
                    <li><a href='#'><img src='4.png' /></a></li>
                    <li><a href='#'><img src='5.png' /></a></li>
                </ul>
            </div>
          <div id='right_scroll'><img src='right.png' /></div>
          </div>

CSS

#bigimage_container
{
    height: 100px;
    width: 100px;
}

JavaScript

alert($('#carousel_ul li:first img').attr("src"));

$("#bigimage_container").css("background-image","url('"+$('#carousel_ul li:first img').attr("src")+"')")