jquery my else if part not working... what is wrong?
<p>I am doing a DOM manipulation using jQuery's <code>map</code> function. Using this I am trying to append an element to a form.</p>

<p>It works fine only one time; by that mean I am getting the result only in the <code>if</code>  portion, I can't get any value from the <code>else if</code> portion. What is wrong with my function, or is my approachwrong?</p>

<p>My data:</p>

<pre><code>"fields":[
            {
               "id":"firstname",
               "label":"First Name",
               "name":"fname",
               "type":"text",
               "value":""
            },
            {
               "id":"email",
               "label":"Email",
               "name":"email",
               "type":"text",
               "value":""
            },
            {
               "id":"countries",
               "label":"Country",
               "name":"countries",
               "type":"select",
               "options":[
                  {
                     "value":"",
                     "text":"Select Country"
                  },
                  {
                     "value":"in",
                     "text":"India",
                      "selected":"true"
                  },
                  {
                     "value":"us",
                     "text":"United Stated"

                  },
                  {
                     "value":"uk",
                     "text":"United Kingdom"
                  },
                  {
                     "value":"cn",
                     "text":"Canada"
                  }
               ]
            },
            {
               "id":"submit",
               "name":"submit",
               "type":"submit",
               "value":"Submit"
            }
         ] 
</code></pre>

<p>My function:</p>

<pre><code>    var processModules = function (mData) {
        $.map(mData, function (val,i) {
            $(val.container).append(
                $(val.type === 'content' || val.type === 'navigation' ?
                $('&lt;div /&gt;',{
                    'class':val.attributes['class'],
                    id:val.attributes.id})
                .append(val.title ? $('&lt;h2 /&gt;',{text:val.title}) : "")
                .append(val.subtitle ? $('&lt;h3&gt;',{text:val.subtitle}) : "")
                :
                val.type === 'form' ? $('&lt;form /&gt;',{
                    id:val.attributes.id,
                    'class':val.attributes['class'],
                    action:val.action,
                    name:val.name
                })
                .append($('&lt;legend /&gt;',{text:val.title}))
                .append(
                    $.map(val.fields, function (val,i) {
var element;
                        if(val.id) {
                            console.log(val.id); // getting values and appending elements
                        }
                        if (val.label) {
                            element = $('&lt;label /&gt;',{text:val.label}); //  am not getting any value here..
                        }
                        if (val.type) {
                            element = $('&lt;input /&gt;',{id:val.id}) // I am only getting value here..
                        }
                    } )
                )
                : ""));
        } )
    }
</code></pre>

<p>What is the issue? Can anyone help me?</p>
