unwrap text in multi line EDIT case in jqgrid

I need to Edit rows in jqgrid but the data is multilined. to display the data into multiple rows in view mode i added

function myformatter ( cellvalue, options, rowObject )
        {
            return cellvalue.split(' ').join('<br/>');
        }

but now, when i edit the rows, I see a
tag and again the values appear in a single line. can someone help me here display the emails in a new line in a single cell in edit mode.

my grid code :

               $(function () {



           var mydata =[{
               "email": "abc.123@abc.com  abc.def@abc.com  abc.def@abc.com  abc.def@abc.com",
               "name": "abc, def",
               "address": "USA1"

             },
             {
               "email": "abc.def@abc.com  abc.def@abc.com  abc.def@abc.com  abc.def@abc.com",
               "name": "abSFc, def",
               "address": "USA2"
             },
        {
          "email": "awwwwwwwwwwwwwbc.def@abc.com",
          "name": "abc, def",
          "address": "USA3"
        },
        {
          "email": "abc.def@abc.com",
          "name": "aDbc, def",
          "address": "UK4"
        },
        {
          "email": "FEabc.def@abc.com",
          "name": "FDabc, def",
          "address": "UK5"
        },
        {
          "email": "abDc.def@abc.com",
          "name": "abc, def",
          "address": "UK6"
        },
        {
          "email": "abDc.def@abc.com",
          "name": "aDbc, def",
          "address": "UK7"
        },
        {
          "email": "abDc.def@abc.com",
          "name": "abc, def",
          "address": "USA8"
        },
        {
          "email": "abDc.def@abc.com",
          "name": "abwqewfdec, def",
          "address": "USA9"
        },
        {
          "email": "abDc.def@abc.com",
          "name": "awvferbc, def",
          "address": "USA88"
        },
        {
          "email": "awwwwwwwwwwwwwwwwbc.def@abc.com",
          "name": "abwvfwc, def",
          "address": "USA"
        }];
                  var lastsel;            
                  $("#list").jqGrid({
                      datatype: 'local',
                      data: mydata,
                      colNames: ['Email', 'Name', 'Address'],
                     colModel: [
              { name: 'email', width: 250, align: 'center',editable: true,formatter:myformatter

              },
              { name: 'name', width: 150, align: 'center',editable: true
                           },
              { name: 'address', width: 150, editable: true}

          ],
                 rowList:[10,20,20],
        rowNum:15,
                 pager: '#pager',

          gridview: true,
          viewrecords: true,
          height: '100%',
          width: '50%',
          search:true,
          loadonce: true,
          'cellEdit': true,
          //toppager: true,
          viewrecords: true,    
          caption: 'Grid with rowSpan attributes',
          editurl: '/Home/GetStudents/',

         gridComplete: function () {
                      var grid = this;

                      var filters, i, l, rules, rule, iCol, $this = $("#list");

                      if (this.p.search === true) {

                          filters = $.parseJSON(this.p.postData.filters);
                          if (filters !== null && typeof filters.rules !== 'undefined' &&
                                  filters.rules.length > 0) {
                              rules = filters.rules;
                              l = rules.length;

                              for (i = 0; i < l; i++) {
                                  rule = rules[i];
                                     $('body').highlight( rule.data );
                              }
                          }
                      }

                     /*  var $this = $(this), ids = $this.jqGrid('getDataIDs'), i, l = ids.length;
                      for (i = 0; i < l; i++) {
                          $this.jqGrid('editRow', ids[i], true);
                      } */
                  }
        });

                  var lastSelection;

                  function editRow(id) {
                      if (id && id !== lastSelection) {
                          var grid = $("#list");
                          grid.jqGrid('restoreRow',lastSelection);
                          grid.jqGrid('editRow', id, true);
                      //    grid.jqGrid('editRow',id, {keys: true} );
                          lastSelection = id;
                      }
                  }

                  $("#list").jqGrid('filterToolbar',{stringResult: true, searchOnEnter : false , defaultSearch: 'cn', ignoreCase: true});
        //                      
                    function myformatter ( cellvalue, options, rowObject )
                    {
                        return cellvalue.split(' ').join('<br/>');
                    }
        });

Try to use new line replace < /br> into "\\n".

return cellvalue.split(' ').join('\\n');