dynamically added images not getting added on page when toggel function in Jquery is used
<p>Below is code to add images in Javascript.</p>

<pre><code>function AddFirstRow() {
    //Create an input type dynamically.
    var element ;
    var seatArr = document.getElementById("seatArr");

    //Assign different attributes to the element.
    var  rowCounter ;
    for( rowCounter = 1 ; rowCounter &lt; 8 ; rowCounter++ ){
        element = document.createElement("input");
        element.setAttribute("type", "image");
        element.setAttribute("src","../Images/available_seat_img.png") ;
        element.setAttribute("class", "seatRightMostRow1");
        element.setAttribute("id", "1V");
        seatArr.appendChild(element);
    }
}
</code></pre>

<p>Body elements where images are added.</p>

<pre><code>&lt;div class="seatArr"&gt;        
    &lt;span id="seatArr" &gt;&amp;nbsp;&lt;/span&gt; 
    &lt;input type="image" class="seatRightMostRow1" id="1A" alt="sfdsf" src="../Images/available_seat_img.png"  /&gt;
    &lt;input type="image" class="seatRightMostRow2" id="1B" alt="sfdsf" src="../Images/available_seat_img.png"  /&gt;
&lt;/div&gt; 
</code></pre>

<p>JQuery for toggel feature on image.</p>

<pre><code>$("input[id]").toggle(function(){
    $(this).attr("src","../Images/selected_seat_img.png");
},function(){
    $(this).attr("src","../Images/available_seat_img.png");
});
</code></pre>
