title: Calculator by JavaScript and jQuery
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.calculator-body{
   padding-top: 20px;
  }
  
  .calculator-monitor{
      border-radius: 5px;
      background-color: rgba(128, 128, 128, 0.09);
   margin-bottom: 10px;
   text-align-last: right;
   padding: 10px;
  }
  
  .btn{
   width: 40px;
   height: 40px;
   margin: 2px 1px;
   padding: 5px 15px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
   &lt;title&gt;cALCULATOR&lt;/title&gt;
   &lt;meta charset="utf-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"&gt;
   &lt;link rel="stylesheet" type="text/css" href="css/font-awesome.min.css"&gt;
   &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
   &lt;link rel="stylesheet" type="text/css" href="css/style.css"&gt;
   &lt;script type="text/javascript" src="js/jquery-3.1.1.min.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="js/js.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
   &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"&gt;&lt;/script&gt;
   &lt;div class="container"&gt;
    &lt;div class="row text-center"&gt;
     &lt;div class="col-xs-12 col-sm-6 col-sm-offset-3 bg main-block" id="mainBlock"&gt;
      &lt;div class="calculator-body"&gt;
       &lt;div class="row calculator-screen-row"&gt;
        &lt;input type="text" name="" class="calculator-monitor" placeholder="0"&gt;
       &lt;/div&gt;
       &lt;div class="row buttons-row first-buttons-row"&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="7"&gt;7&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="8"&gt;8&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="9"&gt;9&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button"&gt;/&lt;/button&gt;
       &lt;/div&gt;
       &lt;div class="row buttons-row first-buttons-row"&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="4"&gt;4&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="5"&gt;5&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="6"&gt;6&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button"&gt;x&lt;/button&gt;
       &lt;/div&gt;
       &lt;div class="row buttons-row first-buttons-row"&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="1"&gt;1&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="2"&gt;2&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="3"&gt;3&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button"&gt;-&lt;/button&gt;
       &lt;/div&gt;
       &lt;div class="row buttons-row first-buttons-row"&gt;
        &lt;button class="btn btn-default calculator-button number-button" value="0"&gt;0&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button"&gt;.&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button"&gt;+&lt;/button&gt;
        &lt;button class="btn btn-default calculator-button"&gt;=&lt;/button&gt;
       &lt;/div&gt;
      &lt;/div&gt;
     &lt;/div&gt;
    &lt;/div&gt;
   &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Hi everyone, Actually I am new in coding and especially in JS. 
  Now I need to make a simple calculator with several operations.
  I have tried several ways but none of them was right. 
  I need to onclick of some of the numbers, the value of input was changed to the value of button (number). 
  How can I manage it, I will be glad to see the answer by using jQuery.</p>