jQuery addClass example

Change class name on click in jQuery

HTML

<html>

<head>

  <title>Cadastro de Quiz</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

</head>

<body>
  <div class="container theme-showcase" role="main">
    <div class="page-header">
      <h1></h1>
    </div>

    <form class="form-horizontal" name="formfunc" method="POST">

      <td>
        <button type="button" name="add" id="add" style="margin:10;" class="col-sm-5 btn btn-success">Adicionar Pergunta</button>
        <input class="col-sm-5 btn btn-success" type="submit" style="margin:10;" value="Cadastrar">
      </td>

      <table class="table" id="dynamic_field">
        <tr>
          <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">
                            Titulo
                        </label>
            <div class="col-sm-10">
              <input type="hidden" class="form-control" name="0[Principal]" value="Informações" />
              <input type="text" class="form-control" name="0[Configuracoes][0][Titulo]" value="O quanto você sabe sobre: Mortal Kombat 9?" id="titulo" />
            </div>
          </div>

          <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">
                            Imagem Padrão:
                        </label>
            <div class="col-sm-10">
              <input type="text" class="form-control" name="0[Configuracoes][0][Image_padrao]" value="URL IMG" id="imagem_padrao" />
            </div>
          </div>

          <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">
                            Imagem Fonte:
                        </label>
            <div class="col-sm-10">
              <input type="text"...

JavaScript

$(document).ready(function() {
  
  var arrayPergunta = [];
  var arrayResposta = [];
    
  $('#add').click(function() {
    
    var pergunta = { Titulo: $("#titulo").val()
                    , Image_padrao: $("#imagem_padrao").val()
                    , ImageFont: $("#imagefont").val()
                    , ImageFontUrl: $("#ImageFontUrl").val()
                    , Tags: $("#Tags").val()
                    , Descricao: $("#Descricao").val()
                    , Type: $("#Type").val()
                	};
                  
		var resposta = 	{ Resposta: "1"
    									, ce: "2"
                      , Image_resposta: "3"
                      , ImageFont: "4"
                      , ImageFontUrl: "5"
    								};
             
		var arrayTotal = $(pergunta).slice();

		arrayTotal.push(resposta);

		console.log(arrayTotal);
  
  });

});