Question

CSS:

    .dynamicDiv {
    width:200px;
    border:solid 1px #c0c0c0;
    background-color:#e1e1e1;
    font-size:11px;
    font-family:verdana;
    color:#000;
    padding:5px;
    }

Javascript:

    //create array
    var myNames=new Array();
    //var nameString=document.getElementById(myNames.toString())

    function addToDiv()
    {
        //1) add name to div
        document.getElementById('divName').innerHTML = document.getElementById('divName').innerHTML + document.getElementById('enter_name').value + "<br>";
        //2) now add the value to an array
        myNames.push(document.getElementById('enter_name').value);
        //strHTML = document.getElementById('divName').innerHTML + document.getElementById('enter_name').value + "<br>";
        //document.getElementById('divName').innerHTML = strHTML;
    }

    function displayMessage()
    {
        //debugger;
        var strMessage = "Welcome to this page ";

        //loop throught the array and add the element values to strMessage
        for(i=0;i<=myNames.length-1;i++)
        {
            strMessage = strMessage + myNames[i] + ", "
        }

        //remove trainling comma
        //strMessage = strMessage

        alert(strMessage);
    }

    function displayMessagebye()
    {
        //debugger;
        var strMessage = "Thank you for coming to this page ";

        //loop throught the array and add the element values to strMessage
        for(i=0;i<=myNames.length-1;i++)
        {
            strMessage = strMessage + myNames[i] + ", "
        }

        //remove trainling comma
        //strMessage = strMes
        //strMessage = strMessage.substr(
        alert(strMessage);
    }

HTML :

<div class="dynamicDiv">
  <input type="text" name="enter_name" id="enter_name" />
  <input name="button" id="button" value="Submit" type="button" onclick="addToDiv();"/>
</div>

<div id="divName" class="dynamicDiv" style="margin:10px 0px;">
<h2>Names List</h2><p>Names of person you've already added.</p>
</div>
<div class="dynamicDiv"><input type="button" onclick="displayMessagebye();" value="Loop" /></div>
<div id="loop" > </div>
<div class="dynamicDiv"><input type="button" onclick="displayMessage();" value="String" /></div>
<div id="string" > </div>

Answer 1

You could replace the last “, ” with “.” by:

strMessage.replace(/, $/, ".")