Untitled


<!DOCTYPE html>
<html>
<head>
<title>js</title>

<style>
    .color-yellow {
        color: yellow;
    }
    .color-light-green {
        color: lightgreen;
    }
</style>

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script>
    $(document).ready(function() {
        var texts = [];
        $('div').each(function(index) {
		console.log(index);
            if ((index + 1) % 2 == 0) {
			var txt = "<span style='color:yellow'>"
			txt = txt + $(this).text();
			txt = txt + "</span>";
			$(this).html(txt);
            } else {
                	var txt = "<span style='color:lightgreen'>"
			txt = txt + $(this).text();
			txt = txt + "</span>";
			$(this).html(txt);

            }
            texts.push($(this).text());
        });
        var new_html = '';
        for (var i = texts.length - 1; i >= 0; i--) {
            new_html = new_html + texts[i] + '<br />';
        }
		console.log(new_html);
        $('.larger-div').html(new_html);
    });
</script>

</head>

<body>
    <div>text</div>
    <div>text1</div>
    <div>text2</div>
    <div>text3</div>
    <div>text4</div>
    <div>text5</div>
    <div>more difficult</div>

    <hr />

    <div class='larger-div'>

    </div>

</body>

</html>