title: Making an "input" button text non editable
body: <p>Using a javascript dictionary to create an assignment list, there are two elements: text (the title) and text2 (a hash anchor link)</p>
  
  <pre><code>    var cell2 = row.insertCell(1);
      var element2 = document.createElement("input");
      element2.type = "viewButton";
      element2.value = todoDictionary["text"];
      var link= todoDictionary["text2"];
      element2.id = rowID;
      element2.setAttribute("onclick","window.location.hash = link");
      element2.className = "viewButton";
      cell2.appendChild(element2);
  </code></pre>
  
  <p>When the list is diplayed, when I click on the item title, it temporarily brings up the keyboard before going to the link. I assume it's because it is an "input" item. I tried "label" and "text area" instead of "input" in the document.createElement, but the title doesn't show. 
  any way to make it so it's still a button but the title isn't editable?</p>
  
  <p>EDIT:
  New issue @david thomas
  When I change the element type to button, it now ignores the "viewButton" css that I have put into the file. On first launch, it keeps the proper style. On second launch, it defaults to the jquery CSS. But if I add new items, they come in the right style.</p>
  
  <p>if I leave the element type to "viewButton" the style stays, but it also allows editing of the text. </p>
  
  <p>I had this style issue happen before, which I fixed by adding the "viewButton" style to the jquery CSS. 
  <a href="https://stackoverflow.com/questions/20413611/css-style-not-sticking">CSS style not sticking</a></p>
  
  <p>Any ideas on how to override the style?</p>
  
  <p>Noel</p>