title: Need to restrict clone max10 in mobile device using jquery
body: <p>Working on Jquery clone where in large device like desktop and tablet user can clone more but in mobile I have to restrict user to clone 10.  Is this possible to restrict user to clone</p>
  
  <p>Here is the jquery code</p>
  
  <pre><code>    var i = 1;
  $(document).on("click", ".btn_more", function () {
      $(".cloned-row:first").clone().insertAfter(".cloned-row:last").attr({
          'id': function(_, id) {
              return id + i
          },
          'name': function(_, name) {
              return name + i
          },
          'class': "add_pn_grp"
              //'value': ''
      }).end().find('[id]').attr({
          'id': function(_, id) {
              return id + i
          }
      });
  
      if(i &lt; $('.cloned-row1').length){
          $(this).closest(".edu_add_button").removeClass('btn_more edu_add_button').addClass('btn_less btn_less1');
      }   
      i++;
  });
  $(document).on('click', ".btn_less", function () {
      $(this).closest(".cloned-row").remove();
  });
  </code></pre>
  
  <p>Here is the html code</p>
  
  <pre><code>                        &lt;div id ="phone_div" class="col-xs-12 col-sm-9 col-md-9 col-lg-9 "&gt;
                           &lt;!--Phone information Help pop up--&gt;
                                  &lt;div class="modal-dialog" role="document" id="phonehint" align="center"&gt;
                                      &lt;div class="modal-content"&gt;
                                          &lt;div class="modal-header text-center" &gt;
                                              &lt;h4 id="myModalLabel" class="modal-title" style="color:black;"&gt;Help - Phone&lt;/h4&gt;
                                          &lt;/div&gt;
                                          &lt;div class="modal-body" &gt;
                                              &lt;h5 style="color:black;" align="left"&gt; Provide number &lt;br/&gt;Provide your phone number along with the country code.&lt;/h5&gt;                                                  
                                          &lt;/div&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;!--Contact information Help pop up Ends--&gt;
                       &lt;label&gt;Phone&lt;/label&gt;&amp;nbsp;&amp;nbsp;&lt;i class="fa fa-question-circle help_icon" onclick="showphonehint()" onmouseout="hidephonehint()"&gt;&lt;/i&gt;
                        &lt;div class="em_pho cloned-row"&gt;
                           &lt;select id="sel_phntype" name="sel_phntype" class="sslt_Field"&gt;
                              &lt;option selected='selected' value=""&gt;Phone Type&lt;/option&gt;
                              &lt;option value="BUSN"&gt;Business&lt;/option&gt;
                              &lt;option value="CAMP"&gt;Campus&lt;/option&gt;
                              &lt;option value="CELL" &gt;Cellphone&lt;/option&gt;
                              &lt;option value="CEL2"&gt;Cellphone2&lt;/option&gt;
                              &lt;option value="FAX"&gt;FAX&lt;/option&gt;
                              &lt;option value="HOME"&gt;Home&lt;/option&gt;
                              &lt;option value="OTR"&gt;Other&lt;/option&gt;
                           &lt;/select&gt;
                           &lt;span class = "ph-inline"&gt;
                              &lt;input type="text" class="cc_field" placeholder="Country Code" id="txt_CC" maxlength="3" name="txt_CC" /&gt; 
                              &lt;input type="text" class="pn_field" placeholder="Phone Number" id="txt_Pno" name="txt_Pno" /&gt;
                              &lt;input type="radio" name="preferred" id="rad_Prf" value="preferred"&gt;
                              &lt;label class="radio-label"&gt;Preferred&lt;/label&gt;
                              &lt;!--&lt;button class="btn_more" id="buttonvalue"&gt;&lt;/button&gt;--&gt;
                              &lt;input type="button" class="btn_more" id="buttonvalue"/&gt;
                           &lt;/span&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
  </code></pre>
  
  <p>I have created variable count I have assigned the count as 10 but how to restrict in mobile I am confused like anything.</p>
  
  <p>Kindly help me </p>
  
  <p>Thanks in advance
  Mahadevan</p>