Change characters

Change class name on click in jQuery

by Marius Jopen

HTML

<div class="change">
 <div>
   <div>
      <p>
        <span>
          Eine, Forschungsarbeit der Cambridge Universität hat bewiesen, dass es nciht wichtig ist in welcher Reihenfolge die Buchstaben in einem Wort stehen solange der erste und letzte Buchstabe am richtigen Ort stehen Der Rest kann Chaos sein und man kann es
          immernoch ohne Probleme lesen Das funktioniert weil das Gehirn keine einzelnen Buchstaben sondern ganze Wörter ließt
        </span>
      </p>
    </div>
  </div>
</div>

<div class="change">
 <div>
   <div>
      <p>
        <span>
          Eine, Forschungsarbeit der Cambridge Universität hat bewiesen, dass es nciht wichtig ist in welcher Reihenfolge die Buchstaben in einem Wort stehen solange der erste und letzte Buchstabe am richtigen Ort stehen Der Rest kann Chaos sein und man kann es
          immernoch ohne Probleme lesen Das funktioniert weil das Gehirn keine einzelnen Buchstaben sondern ganze Wörter ließt
        </span>
      </p>
    </div>
  </div>
</div>

JavaScript

$(".change span").each(function() {
  var original = $(this).text();

  $(this).attr('original', original);
  $(this).text(null);

  var modified_get = shuffle(original);

  $(this).attr('modified', modified_get.join(""));
  $(this).text(modified_get.join(""));
});



$(".change span").mouseenter(function() {
  var original = $(this).attr("original");
  $(this).text(original);
});

$(".change span").mouseleave(function() {
  var modified = $(this).attr("modified");
  $(this).text(modified);
});



function shuffle(original) {

  var c = original.trim();
  var words = c.split(" ");
  var modified = [];

  for (var c_i = 0; c_i < words.length; c_i++) {

    c = words[c_i];



    var c_length = c.length;
    var c_first = c.slice(0, 1);
    var c_last = c.substring(c_length - 1);
    var c_sliced = c.slice(1, -1);
    var c_sliced_length = c_length - 2;

    var x = [];
    var s = '';

    for (i = 0; i < c_sliced_length; i++) {
      x[i] = i;
    }

    for (i = 0; i < c_sliced_length; i++) {
      m = c_sliced_length - i;
      r = Math.floor(Math.random() * m);
      d = x[r];
      s += c_sliced[d];
      x.splice(r, 1);
    }

    var new_word = c_first + s + c_last + " ";

    modified.push(new_word);
  }

  return modified;
}